Add babel with es2015 support, use const in the gulpfile, update npm dependencies, and configure modernizr to include classes

This commit is contained in:
Kevin MacMartin 2016-06-21 13:52:52 -04:00
parent 4f13135f97
commit bd4fcd53b8
2 changed files with 29 additions and 21 deletions

View file

@ -1,11 +1,12 @@
// include packages // include packages
var gulp = require("gulp"), const gulp = require("gulp"),
gUtil = require("gulp-util"), gUtil = require("gulp-util"),
gLess = require("gulp-less"), gLess = require("gulp-less"),
gConcat = require("gulp-concat"), gConcat = require("gulp-concat"),
gPlumber = require("gulp-plumber"), gPlumber = require("gulp-plumber"),
gUglify = require("gulp-uglify"), gUglify = require("gulp-uglify"),
gModernizr = require("gulp-modernizr"), gModernizr = require("gulp-modernizr"),
gBabel = require("gulp-babel"),
gPostCSS = require("gulp-postcss"), gPostCSS = require("gulp-postcss"),
autoprefixer = require("autoprefixer"), autoprefixer = require("autoprefixer"),
lessGlob = require("less-plugin-glob"), lessGlob = require("less-plugin-glob"),
@ -13,18 +14,18 @@ var gulp = require("gulp"),
lessCleanCSS = require("less-plugin-clean-css"); lessCleanCSS = require("less-plugin-clean-css");
// determine if gulp has been run with --production // determine if gulp has been run with --production
var prod = gUtil.env.production; const prod = gUtil.env.production;
// initialize plugins // initialize plugins
var cleancss = new lessCleanCSS({ advanced: true }); const cleancss = new lessCleanCSS({ advanced: true });
// declare plugin settings and modernizr tests // declare plugin settings and modernizr tests
var lessPlugins = prod ? [ lessGlob, cleancss ] : [ lessGlob ], const lessPlugins = prod ? [ lessGlob, cleancss ] : [ lessGlob ],
autoprefixerSettings = { remove: false, cascade: false, browsers: [ "last 6 versions" ] }, autoprefixerSettings = { remove: false, cascade: false, browsers: [ "last 6 versions" ] },
modernizrTests = []; modernizrTests = [];
// javascript files for the public site // javascript files for the public site
var jsPublic = [ const jsPublic = [
"resources/assets/js/site-vars.js", "resources/assets/js/site-vars.js",
"resources/assets/js/contact.js", "resources/assets/js/contact.js",
"resources/assets/js/subscription.js", "resources/assets/js/subscription.js",
@ -32,19 +33,19 @@ var jsPublic = [
]; ];
// javascript libraries for the public site // javascript libraries for the public site
var jsPublicLibs = [ const jsPublicLibs = [
"bower_components/jquery/dist/jquery.min.js", "bower_components/jquery/dist/jquery.min.js",
"bower_components/bootstrap/dist/js/bootstrap.min.js", "bower_components/bootstrap/dist/js/bootstrap.min.js",
"bower_components/jQuery.stickyFooter/assets/js/jquery.stickyfooter.js" "bower_components/jQuery.stickyFooter/assets/js/jquery.stickyfooter.js"
]; ];
// javascript files for the dashboard // javascript files for the dashboard
var jsDashboard = [ const jsDashboard = [
"resources/assets/js/dashboard.js" "resources/assets/js/dashboard.js"
]; ];
// javascript libraries for the dashboard // javascript libraries for the dashboard
var jsDashboardLibs = [ const jsDashboardLibs = [
"bower_components/jquery/dist/jquery.min.js", "bower_components/jquery/dist/jquery.min.js",
"bower_components/bootstrap/dist/js/bootstrap.min.js", "bower_components/bootstrap/dist/js/bootstrap.min.js",
"bower_components/Sortable/Sortable.js", "bower_components/Sortable/Sortable.js",
@ -53,7 +54,7 @@ var jsDashboardLibs = [
]; ];
// paths to folders containing fonts that should be copied to public/fonts/ // paths to folders containing fonts that should be copied to public/fonts/
var fontPaths = [ const fontPaths = [
"resources/assets/fonts/**", "resources/assets/fonts/**",
"bower_components/bootstrap/dist/fonts/**", "bower_components/bootstrap/dist/fonts/**",
"bower_components/font-awesome/fonts/**" "bower_components/font-awesome/fonts/**"
@ -76,12 +77,12 @@ function processLess(filename) {
} }
// function to handle the processing of javascript files // function to handle the processing of javascript files
function processJavaScript(ouputFilename, inputFiles) { function processJavaScript(ouputFilename, inputFiles, es6) {
var javascript = gulp.src(inputFiles) const javascript = gulp.src(inputFiles)
.pipe(gPlumber(plumberError)) .pipe(gPlumber(plumberError))
.pipe(gConcat(ouputFilename + ".js")); .pipe(gConcat(ouputFilename + ".js"));
// minify if running gulp with --production if (es6) { javascript.pipe(gBabel({ presets: [ "es2015" ] })); }
if (prod) { javascript.pipe(gUglify()); } if (prod) { javascript.pipe(gUglify()); }
return javascript.pipe(gulp.dest("public/js/")); return javascript.pipe(gulp.dest("public/js/"));
} }
@ -98,28 +99,33 @@ gulp.task("less-dashboard", function() {
// gulp task for public javascript // gulp task for public javascript
gulp.task("js-public", function() { gulp.task("js-public", function() {
return processJavaScript("app", jsPublic); return processJavaScript("app", jsPublic, true);
}); });
// gulp task for public javascript libraries // gulp task for public javascript libraries
gulp.task("js-public-libs", function() { gulp.task("js-public-libs", function() {
return processJavaScript("lib", jsPublicLibs); return processJavaScript("lib", jsPublicLibs, false);
}); });
// gulp task for dashboard javascript // gulp task for dashboard javascript
gulp.task("js-dashboard", function() { gulp.task("js-dashboard", function() {
return processJavaScript("dashboard", jsDashboard); return processJavaScript("dashboard", jsDashboard, true);
}); });
// gulp task for dashboard javascript libraries // gulp task for dashboard javascript libraries
gulp.task("js-dashboard-libs", function() { gulp.task("js-dashboard-libs", function() {
return processJavaScript("lib-dashboard", jsDashboardLibs); return processJavaScript("lib-dashboard", jsDashboardLibs, false);
}); });
// gulp task for modernizr // gulp task for modernizr
gulp.task("modernizr", function() { gulp.task("modernizr", function() {
var modernizr = gulp.src([ "public/js/lib.js", "public/js/app.js", "public/css/app.css" ]) const modernizr = gulp.src([ "public/js/lib.js", "public/js/app.js", "public/css/app.css" ])
.pipe(gModernizr({ tests: modernizrTests, crawl: false })) .pipe(gModernizr({
tests: modernizrTests,
excludeTests: [ "hidden" ],
crawl: false,
options: [ "setClasses", "addTest", "html5printshiv", "testProp", "fnBind" ]
}))
.pipe(gPlumber(plumberError)) .pipe(gPlumber(plumberError))
.pipe(gConcat("modernizr.js")); .pipe(gConcat("modernizr.js"));
@ -137,9 +143,9 @@ gulp.task("fonts", function() {
// gulp watch task // gulp watch task
gulp.task("watch", function() { gulp.task("watch", function() {
var gLiveReload = require("gulp-livereload"); const gLiveReload = require("gulp-livereload");
var liveReloadUpdate = function(wait) { const liveReloadUpdate = function(wait) {
setTimeout(function() { setTimeout(function() {
gLiveReload.changed("."); gLiveReload.changed(".");
}, wait || 1); }, wait || 1);

View file

@ -5,9 +5,11 @@
}, },
"dependencies": { "dependencies": {
"autoprefixer": "^6.3.6", "autoprefixer": "^6.3.6",
"babel-preset-es2015": "^6.9.0",
"gulp": "^3.9.1", "gulp": "^3.9.1",
"gulp-babel": "^6.1.2",
"gulp-concat": "^2.6.0", "gulp-concat": "^2.6.0",
"gulp-less": "^3.0.5", "gulp-less": "^3.1.0",
"gulp-modernizr": "^1.0.0-alpha", "gulp-modernizr": "^1.0.0-alpha",
"gulp-plumber": "^1.1.0", "gulp-plumber": "^1.1.0",
"gulp-postcss": "^6.1.1", "gulp-postcss": "^6.1.1",