From 6bb9fb21cb50c57992df091520e0092616822bf3 Mon Sep 17 00:00:00 2001 From: Austin Pray Date: Wed, 14 Jan 2015 16:02:40 -0600 Subject: [PATCH] Use new manifest format Simplifies and consolidates gulp tasks Adds a --production flag to disable source maps Uses pleeease.io for css optimization --- README.md | 1 + assets/manifest.json | 32 +++++++++------- bower.json | 3 ++ gulpfile.js | 91 +++++++++++++++++++++++++------------------- package.json | 20 +++++----- 5 files changed, 83 insertions(+), 64 deletions(-) diff --git a/README.md b/README.md index ecca5d3..06caebc 100644 --- a/README.md +++ b/README.md @@ -77,6 +77,7 @@ You now have all the necessary dependencies to run the build process. * `gulp` — Compile and optimize the files in your assets directory * `gulp watch` — Compile assets when file changes are made +* `gulp --production` — Compile assets for production (no source maps). * `gulp --tasks` — Lists all the available tasks and what they do ## Documentation diff --git a/assets/manifest.json b/assets/manifest.json index 26ed346..443fed3 100644 --- a/assets/manifest.json +++ b/assets/manifest.json @@ -1,22 +1,28 @@ { "dependencies": { - "theme": { - "scripts": [ + "app.js": { + "files": [ "scripts/**/*", "scripts/main.js" ], - "styles": "styles/main.less", - "editorStyle": "styles/editor-style.less" + "main": true }, - "vendor": { - "scripts": [], - "styles": [] + "main.css": { + "files": [ + "styles/main.less" + ], + "main": true + }, + "editor-style.css": { + "files": [ + "styles/editor-style.less" + ] + }, + "jquery.js": { + "bower": ["jquery"] + }, + "modernizr.js": { + "bower": ["modernizr"] } - }, - "ignoreDependencies": { - "bower": [ - "jquery", - "modernizr" - ] } } diff --git a/bower.json b/bower.json index 4745feb..f88b46b 100644 --- a/bower.json +++ b/bower.json @@ -13,6 +13,9 @@ "bootstrap": "3.3.1" }, "overrides": { + "modernizr": { + "main": "./modernizr.js" + }, "bootstrap": { "main": [ "./less/bootstrap.less", diff --git a/gulpfile.js b/gulpfile.js index 62bfcc9..b3579af 100644 --- a/gulpfile.js +++ b/gulpfile.js @@ -1,55 +1,63 @@ /*global $:true*/ -var $ = require('gulp-load-plugins')(); -var _ = require('lodash'); -var autoprefixer = require('autoprefixer-core'); -var csswring = require('csswring'); -var gulp = require('gulp'); -var lazypipe = require('lazypipe'); -var mainBowerFiles = require('main-bower-files'); -var obj = require('object-path'); - +var $ = require('gulp-load-plugins')(); +var _ = require('lodash'); +var argv = require('yargs').argv; +var gulp = require('gulp'); +var lazypipe = require('lazypipe'); var manifest = require('asset-builder')('./assets/manifest.json'); +var merge = require('merge-stream'); -var path = manifest.buildPaths; +var mapsEnabled = !argv.production; +var path = manifest.paths; var globs = manifest.globs; +var project = manifest.getProjectGlobs(); var cssTasks = function(filename) { - var processors = [ - autoprefixer({browsers: ['last 2 versions', 'ie 8', 'ie 9', 'android 2.3', 'android 4', 'opera 12']}), - csswring - ]; - return lazypipe() .pipe($.plumber) - .pipe($.sourcemaps.init) + .pipe(function () { + return $.if(mapsEnabled, $.sourcemaps.init()); + }) .pipe(function() { return $.if('*.less', $.less().on('error', function(err) { console.warn(err.message); })); }) .pipe(function() { - return $.if('*.scss', $.sass()); + return $.if('*.scss', $.sass({ + outputStyle: 'nested', // libsass doesn't support expanded yet + precision: 10, + includePaths: ['.'], + onError: console.error.bind(console, 'Sass error:') + })); }) .pipe($.concat, filename) - .pipe($.postcss, processors) - .pipe($.sourcemaps.write, '.') + .pipe($.pleeease, { + autoprefixer: { + browsers: [ + 'last 2 versions', 'ie 8', 'ie 9', 'android 2.3', 'android 4', 'opera 12' + ] + } + }) + .pipe(function () { + return $.if(mapsEnabled, $.sourcemaps.write('.')); + }) .pipe(gulp.dest, path.dist + 'styles')(); }; -gulp.task('styles', ['wiredep', 'styles:editorStyle'], function() { - return gulp.src(globs.styles) - .pipe(cssTasks('main.css')); -}); - -gulp.task('styles:editorStyle', function() { - return gulp.src(globs.editorStyle) - .pipe(cssTasks('editor-style.css')); +gulp.task('styles', ['wiredep'], function() { + var merged = merge(); + manifest.forEachDependency('css', function (dep) { + merged.add(gulp.src(dep.globs) + .pipe(cssTasks(dep.name))); + }); + return merged; }); gulp.task('jshint', function() { return gulp.src([ 'bower.json', 'gulpfile.js' - ].concat(obj.get(manifest, 'dependencies.theme.scripts', []))) + ].concat(project.js)) .pipe($.jshint()) .pipe($.jshint.reporter('jshint-stylish')) .pipe($.jshint.reporter('fail')); @@ -58,23 +66,26 @@ gulp.task('jshint', function() { var jsTasks = function(filename) { var fn = filename; return lazypipe() - .pipe($.sourcemaps.init) + .pipe(function () { + return $.if(mapsEnabled, $.sourcemaps.init()); + }) .pipe(function() { return $.if(!!fn, $.concat(fn || 'all.js')); }) .pipe($.uglify) - .pipe($.sourcemaps.write, '.') + .pipe(function () { + return $.if(mapsEnabled, $.sourcemaps.write('.')); + }) .pipe(gulp.dest, path.dist + 'scripts')(); }; -gulp.task('scripts', ['jshint', 'scripts:ignored'], function() { - return gulp.src(globs.scripts) - .pipe(jsTasks('app.js')); -}); - -gulp.task('scripts:ignored', function() { - return gulp.src(globs.scriptsIgnored) - .pipe(jsTasks()); +gulp.task('scripts', ['jshint'], function() { + var merged = merge(); + manifest.forEachDependency('js', function (dep) { + merged.add(gulp.src(dep.globs) + .pipe(jsTasks(dep.name))); + }); + return merged; }); gulp.task('fonts', function() { @@ -119,9 +130,9 @@ gulp.task('build', ['styles', 'scripts', 'fonts', 'images'], function() { gulp.task('wiredep', function() { var wiredep = require('wiredep').stream; - gulp.src(globs.styles) + gulp.src(project.css) .pipe(wiredep()) - .pipe(gulp.dest(path.dist + 'styles')); + .pipe(gulp.dest(path.source + 'styles')); }); gulp.task('default', ['clean'], function() { diff --git a/package.json b/package.json index 5271d58..10637f6 100644 --- a/package.json +++ b/package.json @@ -24,21 +24,19 @@ "node": ">= 0.10.0" }, "devDependencies": { - "asset-builder": "0.0.1", - "autoprefixer-core": "4.0.1", - "csswring": "^2.0.0", - "del": "^0.1.3", + "asset-builder": "~0.3.0", + "del": "^1.1.1", "gulp": "^3.8.10", "gulp-concat": "^2.3.4", "gulp-flatten": "0.0.4", "gulp-if": "^1.2.5", "gulp-imagemin": "^2.0.0", "gulp-jshint": "^1.8.4", - "gulp-less": "^1.3.3", - "gulp-livereload": "^2.1.0", - "gulp-load-plugins": "^0.7.1", + "gulp-less": "^2.0.1", + "gulp-livereload": "^3.4.0", + "gulp-load-plugins": "^0.8.0", + "gulp-pleeease": "^1.1.0", "gulp-plumber": "^0.6.3", - "gulp-postcss": "^3.0.0", "gulp-rename": "^1.2.0", "gulp-rev": "^2.0.1", "gulp-sass": "^1.2.4", @@ -48,9 +46,9 @@ "jshint-stylish": "^1.0.0", "lazypipe": "^0.2.2", "lodash": "^2.4.1", - "main-bower-files": "^2.4.0", - "object-path": "^0.8.0", + "merge-stream": "^0.1.7", "traverse": "^0.6.6", - "wiredep": "^2.1.0" + "wiredep": "^2.1.0", + "yargs": "^1.3.3" } }