Created
February 4, 2014 15:41
-
-
Save maxxon15/8806070 to your computer and use it in GitHub Desktop.
My gulpfile.js config
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
var gulp = require('gulp'), | |
autoprefixer = require('gulp-autoprefixer'), | |
minifycss = require('gulp-minify-css'), | |
uglify = require('gulp-uglify'), | |
rename = require('gulp-rename'), | |
concatenate = require('gulp-concat'); | |
gulp.task('styles', function(){ | |
return gulp.src('assets/stylesheets/*.css') | |
.pipe(autoprefixer('last 2 version', 'safari 5', 'ie 8', 'ie 9', 'ios 6', 'android 4')) | |
.pipe(concatenate('styles.css')) | |
.pipe(gulp.dest('build/assets/stylesheets')) | |
.pipe(minifycss()) | |
.pipe(gulp.dest('build/assets/stylesheets')); | |
}); | |
gulp.task('scripts', function(){ | |
return gulp.src('assets/scripts/*.js') | |
.pipe(uglify()) | |
.pipe(gulp.dest('build/assets/scripts')); | |
}); | |
gulp.task('copy-files', function(){ | |
return gulp.src(['assets/fonts/**','assets/images/**']) | |
.pipe(gulp.dest('build/assets/')); | |
}); | |
gulp.task('copy-html', function(){ | |
return gulp.src(['**/**/*.html','!node_modules/**']) | |
.pipe(gulp.dest('build/')); | |
}); | |
gulp.task('watch', function(){ | |
gulp.watch(['**/**/*.html','!node_modules/**'], ['copy-html']); | |
gulp.watch(['assets/fonts/**','assets/images/**'], ['copy-files']); | |
gulp.watch('assets/stylesheets/*.css', ['styles']); | |
gulp.watch('assets/scripts/*.js',['scripts']); | |
}); | |
gulp.task('default', function() { | |
gulp.start('copy-html', 'copy-files', 'styles', 'scripts'); | |
}); |
I see. What exactly do you mean by project dependencies? The css/js/image files?
node_module
directory is known as the project dependencies that is reqd. to perform build.
css/js/img
are the project assets.
gulpfile.js/package.json,_config.yml
are the build configs.
There is no strict nomenclature though :). I just made up the above list on the fly.
haha! Thanks a lot. :D I might talk to you again when I start with bowerJS though.
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Ok. I know what you mean.
The problem is with the way directories are organised for your project. Your directory structure should be like this,
The trick is to wrap your entire project folder into the
app
directory and all the files processed by gulp into thebuild
directory. Both the folders must lie at the same directory level.For your question,
It is always recommended to use a generic pattern for files keeping in mind the longevity of the project, as updating
gulpfile.js
everytime is a big pain. Hence, your intention is correct. So now yourcopy-html
gulp task will look something like this,app/**/*.html
will take every.html
file in theapp
directory and all of its sub-directories into its scope.node_modules
directory as it is no longer inside theapp
directory. Anyways project dependencies should always be outside the main project folder (app
).