From 45a00cec0e96e8546239ad9e39fb84438830e204 Mon Sep 17 00:00:00 2001 From: Austin Pray Date: Thu, 11 Sep 2014 22:15:45 -0500 Subject: [PATCH 1/3] Use gulp-load-plugins https://www.npmjs.org/package/gulp-load-plugins --- gulpfile.js | 59 ++++++++++++++++++++++------------------------------ package.json | 7 ++++--- 2 files changed, 29 insertions(+), 37 deletions(-) diff --git a/gulpfile.js b/gulpfile.js index 5b36c79..9f5dd1d 100644 --- a/gulpfile.js +++ b/gulpfile.js @@ -1,16 +1,6 @@ -var gulp = require('gulp'), - less = require('gulp-less'), - autoprefix = require('gulp-autoprefixer'), - sourcemaps = require('gulp-sourcemaps'), - rename = require('gulp-rename'), - concat = require('gulp-concat'), - minifyCSS = require('gulp-minify-css'), - jshint = require('gulp-jshint'), - uglify = require('gulp-uglify'), - livereload = require('gulp-livereload'), - stylish = require('jshint-stylish'), - rev = require('gulp-rev'); - modernizr = require('gulp-modernizr'); +/*global $:true*/ +var gulp = require('gulp'); +var $ = require('gulp-load-plugins')(); var paths = { scripts: [ @@ -48,34 +38,35 @@ var destination = { gulp.task('less', function() { return gulp.src(paths.less) - .pipe(sourcemaps.init()) - .pipe(less()).on('error', function(err) { + .pipe($.sourcemaps.init()) + .pipe($.less()).on('error', function(err) { console.warn(err.message); }) - .pipe(autoprefix('last 2 versions', 'ie 8', 'ie 9', 'android 2.3', 'android 4', 'opera 12')) - .pipe(rename('./main.css')) - .pipe(sourcemaps.write()) + .pipe($.autoprefixer('last 2 versions', 'ie 8', 'ie 9', 'android 2.3', 'android 4', 'opera 12')) + .pipe($.rename('./main.css')) + .pipe($.sourcemaps.write()) .pipe(gulp.dest(destination.css)) - .pipe(minifyCSS()) - .pipe(rename('./main.min.css')) + .pipe($.minifyCss()) + .pipe($.rename('./main.min.css')) .pipe(gulp.dest(destination.css)) - .pipe(livereload({ auto: false })); + .pipe($.livereload({ auto: false })); }); gulp.task('jshint', function() { return gulp.src(paths.jshint) - .pipe(jshint()) - .pipe(jshint.reporter(stylish)); + .pipe($.jshint()) + .pipe($.jshint.reporter('jshint-stylish')) + .pipe($.jshint.reporter('fail')); }); gulp.task('js', ['jshint'], function() { return gulp.src(paths.scripts) - .pipe(concat('./scripts.js')) + .pipe($.concat('./scripts.js')) .pipe(gulp.dest(destination.scripts)) - .pipe(uglify()) - .pipe(rename('./scripts.min.js')) + .pipe($.uglify()) + .pipe($.rename('./scripts.min.js')) .pipe(gulp.dest(destination.scripts)) - .pipe(livereload({ auto: false })); + .pipe($.livereload({ auto: false })); }); gulp.task('modernizr', function() { @@ -83,27 +74,27 @@ gulp.task('modernizr', function() { ['assets/js/scripts.min.js'], ['assets/css/main.min.css'] ) - .pipe(modernizr()) + .pipe($.modernizr()) .pipe(gulp.dest(destination.modernizr)) - .pipe(uglify()) - .pipe(rename('./modernizr.min.js')) + .pipe($.uglify()) + .pipe($.rename('./modernizr.min.js')) .pipe(gulp.dest(destination.vendor)); }); gulp.task('version', function() { return gulp.src(['assets/css/main.min.css', 'assets/js/scripts.min.js'], { base: 'assets' }) - .pipe(rev()) + .pipe($.rev()) .pipe(gulp.dest('assets')) - .pipe(rev.manifest()) + .pipe($.rev.manifest()) .pipe(gulp.dest('assets')); }); gulp.task('watch', function() { - livereload.listen(); + $.livereload.listen(); gulp.watch('assets/less/**/*.less', ['less']); gulp.watch('assets/js/**/*.js', ['jshint', 'js']); gulp.watch('**/*.php').on('change', function(file) { - livereload.changed(file.path); + $.livereload.changed(file.path); }); }); diff --git a/package.json b/package.json index aea817a..a819593 100644 --- a/package.json +++ b/package.json @@ -25,18 +25,19 @@ "devDependencies": { "bower": ">=1.3.9", "gulp": "^3.8.7", - "gulp-autoprefixer": "0.0.8", + "gulp-autoprefixer": "^0.0.7", "gulp-concat": "^2.3.4", "gulp-grunt": "^0.5.2", "gulp-jshint": "^1.8.4", - "jshint-stylish": "^0.4.0", "gulp-less": "^1.3.3", "gulp-livereload": "^2.1.0", + "gulp-load-plugins": "^0.5.0", "gulp-minify-css": "^0.3.7", "gulp-modernizr": "https://github.com/doctyper/gulp-modernizr/tarball/develop", "gulp-rename": "^1.2.0", + "gulp-rev": "^1.1.0", "gulp-sourcemaps": "^1.1.1", "gulp-uglify": "^0.3.1", - "gulp-rev": "^1.1.0" + "jshint-stylish": "^0.4.0" } } From 6e0e036ae70ac83f91a27169b93adf088f087b9d Mon Sep 17 00:00:00 2001 From: Austin Pray Date: Thu, 11 Sep 2014 23:04:29 -0500 Subject: [PATCH 2/3] Enhance Gulp dependency compilation Gulp automatically grabs all of the dependencies listed as main files in `bower.json` except for jQuery and modernizr Deletes plugin directory, bad development pattern. Doesn't make sense with the existence of `vendor` directory anyway. Concat all of the js in the js directory except vendor and compiled files --- assets/js/plugins/.gitkeep | 0 bower.json | 18 ++++++++++++++++++ gulpfile.js | 25 +++++++++---------------- package.json | 5 ++++- 4 files changed, 31 insertions(+), 17 deletions(-) delete mode 100644 assets/js/plugins/.gitkeep diff --git a/assets/js/plugins/.gitkeep b/assets/js/plugins/.gitkeep deleted file mode 100644 index e69de29..0000000 diff --git a/bower.json b/bower.json index 0d8195d..3dde4cf 100644 --- a/bower.json +++ b/bower.json @@ -17,5 +17,23 @@ "jquery": "1.11.1", "bootstrap": "3.2.0", "respond": "1.4.2" + }, + "overrides": { + "bootstrap": { + "main": [ + "./js/transition.js", + "./js/alert.js", + "./js/button.js", + "./js/carousel.js", + "./js/collapse.js", + "./js/dropdown.js", + "./js/modal.js", + "./js/tooltip.js", + "./js/popover.js", + "./js/scrollspy.js", + "./js/tab.js", + "./js/affix.js" + ] + } } } diff --git a/gulpfile.js b/gulpfile.js index 9f5dd1d..920c6b2 100644 --- a/gulpfile.js +++ b/gulpfile.js @@ -1,23 +1,13 @@ /*global $:true*/ var gulp = require('gulp'); var $ = require('gulp-load-plugins')(); +var mainBowerFiles = require('main-bower-files'); var paths = { scripts: [ - 'assets/vendor/bootstrap/js/transition.js', - 'assets/vendor/bootstrap/js/alert.js', - 'assets/vendor/bootstrap/js/button.js', - 'assets/vendor/bootstrap/js/carousel.js', - 'assets/vendor/bootstrap/js/collapse.js', - 'assets/vendor/bootstrap/js/dropdown.js', - 'assets/vendor/bootstrap/js/modal.js', - 'assets/vendor/bootstrap/js/tooltip.js', - 'assets/vendor/bootstrap/js/popover.js', - 'assets/vendor/bootstrap/js/scrollspy.js', - 'assets/vendor/bootstrap/js/tab.js', - 'assets/vendor/bootstrap/js/affix.js', - 'assets/js/plugins/*.js', - 'assets/js/_*.js' + 'assets/js/**/*.js', + '!assets/js/vendor/**/*', + '!assets/js/scripts*.js' ], jshint: [ 'gulpfile.js', @@ -26,7 +16,8 @@ var paths = { '!assets/js/scripts.min.js', '!assets/**/*.min-*' ], - less: 'assets/less/main.less' + less: 'assets/less/main.less', + bower: mainBowerFiles() }; var destination = { @@ -38,6 +29,7 @@ var destination = { gulp.task('less', function() { return gulp.src(paths.less) + .pipe($.plumber()) .pipe($.sourcemaps.init()) .pipe($.less()).on('error', function(err) { console.warn(err.message); @@ -60,7 +52,8 @@ gulp.task('jshint', function() { }); gulp.task('js', ['jshint'], function() { - return gulp.src(paths.scripts) + return gulp.src(paths.bower.concat(paths.scripts)) + .pipe($.filter(['**/*.js', '!jquery.js', '!modernizr.js'])) .pipe($.concat('./scripts.js')) .pipe(gulp.dest(destination.scripts)) .pipe($.uglify()) diff --git a/package.json b/package.json index a819593..969fd49 100644 --- a/package.json +++ b/package.json @@ -27,6 +27,7 @@ "gulp": "^3.8.7", "gulp-autoprefixer": "^0.0.7", "gulp-concat": "^2.3.4", + "gulp-filter": "^0.5.0", "gulp-grunt": "^0.5.2", "gulp-jshint": "^1.8.4", "gulp-less": "^1.3.3", @@ -34,10 +35,12 @@ "gulp-load-plugins": "^0.5.0", "gulp-minify-css": "^0.3.7", "gulp-modernizr": "https://github.com/doctyper/gulp-modernizr/tarball/develop", + "gulp-plumber": "^0.6.3", "gulp-rename": "^1.2.0", "gulp-rev": "^1.1.0", "gulp-sourcemaps": "^1.1.1", "gulp-uglify": "^0.3.1", - "jshint-stylish": "^0.4.0" + "jshint-stylish": "^0.4.0", + "main-bower-files": "^1.0.1" } } From 79fdfcb21c412aa9913ba6ea7310903d0d7dfff9 Mon Sep 17 00:00:00 2001 From: Austin Pray Date: Thu, 11 Sep 2014 23:29:41 -0500 Subject: [PATCH 3/3] Adds `gulp images` Lossless image optimization including pngcrush(1) --- README.md | 1 + gulpfile.js | 16 ++++++++++++++++ package.json | 2 ++ 3 files changed, 19 insertions(+) diff --git a/README.md b/README.md index 97dbdca..93eafff 100644 --- a/README.md +++ b/README.md @@ -77,6 +77,7 @@ When completed, you'll be able to run the various Gulp commands provided from th * `gulp dev` — Compile LESS to CSS, concatenate and validate JS * `gulp watch` — Compile assets when file changes are made * `gulp build` — Create minified assets that are used on non-development environments +* `gulp images` — Lossless compression of PNG, JPEG, GIF and SVG images ## Documentation diff --git a/gulpfile.js b/gulpfile.js index 920c6b2..6ea429c 100644 --- a/gulpfile.js +++ b/gulpfile.js @@ -1,6 +1,7 @@ /*global $:true*/ var gulp = require('gulp'); var $ = require('gulp-load-plugins')(); +var pngcrush = require('imagemin-pngcrush'); var mainBowerFiles = require('main-bower-files'); var paths = { @@ -14,6 +15,7 @@ var paths = { 'assets/js/*.js', '!assets/js/scripts.js', '!assets/js/scripts.min.js', + '!assets/js/vendor/**/*', '!assets/**/*.min-*' ], less: 'assets/less/main.less', @@ -74,6 +76,20 @@ gulp.task('modernizr', function() { .pipe(gulp.dest(destination.vendor)); }); +gulp.task('images', function () { + return gulp.src('assets/img/**/*') + .pipe($.imagemin({ + progressive: true, + interlaced: true, + use: [pngcrush()] + })) + .pipe(gulp.dest('assets/img')); +}); + +gulp.task('bust', function () { + $.cache.clearAll(); +}); + gulp.task('version', function() { return gulp.src(['assets/css/main.min.css', 'assets/js/scripts.min.js'], { base: 'assets' }) .pipe($.rev()) diff --git a/package.json b/package.json index 969fd49..3f08142 100644 --- a/package.json +++ b/package.json @@ -29,6 +29,7 @@ "gulp-concat": "^2.3.4", "gulp-filter": "^0.5.0", "gulp-grunt": "^0.5.2", + "gulp-imagemin": "^0.6.0", "gulp-jshint": "^1.8.4", "gulp-less": "^1.3.3", "gulp-livereload": "^2.1.0", @@ -40,6 +41,7 @@ "gulp-rev": "^1.1.0", "gulp-sourcemaps": "^1.1.1", "gulp-uglify": "^0.3.1", + "imagemin-pngcrush": "^1.0.0", "jshint-stylish": "^0.4.0", "main-bower-files": "^1.0.1" }