Update gulp to 4.x and use $(npm bin)/gulp to avoid requiring the latest gulp to be installed system-wide

This commit is contained in:
Kevin MacMartin 2018-04-09 23:04:09 -04:00
parent c25375b951
commit 87ccb893ec
4 changed files with 977 additions and 1074 deletions

73
gulpfile.js vendored
View file

@ -95,13 +95,14 @@ function processSass(filename) {
.pipe(sassGlob()) .pipe(sassGlob())
.pipe(sass({ outputStyle: sassOutputStyle, includePaths: sassPaths })) .pipe(sass({ outputStyle: sassOutputStyle, includePaths: sassPaths }))
.pipe(postCSS([ autoprefixer(autoprefixerSettings) ])) .pipe(postCSS([ autoprefixer(autoprefixerSettings) ]))
.pipe(concat(filename + ".css")); .pipe(concat(filename + ".css"))
.pipe(gulp.dest("public/css/"));
if (isProduction) { if (!isProduction) {
return css.pipe(gulp.dest("public/css/")); css.pipe(browserSync.stream({ match: "**/" + filename + ".css" }));
} else {
return css.pipe(gulp.dest("public/css/")).pipe(browserSync.stream({ match: "**/" + filename + ".css" }));
} }
return css;
} }
// Process vue // Process vue
@ -116,7 +117,10 @@ function processVue(ouputFilename, inputFile) {
.pipe(source(ouputFilename + ".js")) .pipe(source(ouputFilename + ".js"))
.pipe(buffer()); .pipe(buffer());
if (isProduction) { javascript.pipe(stripDebug()).pipe(uglify().on("error", handleError)); } if (isProduction) {
javascript.pipe(stripDebug()).pipe(uglify().on("error", handleError));
}
return javascript.pipe(gulp.dest("public/js/")); return javascript.pipe(gulp.dest("public/js/"));
} }
@ -126,67 +130,72 @@ function processJavaScript(ouputFilename, inputFiles, es6) {
.pipe(plumber(handleError)) .pipe(plumber(handleError))
.pipe(concat(ouputFilename + ".js")); .pipe(concat(ouputFilename + ".js"));
if (es6) { javascript.pipe(babel()); } if (es6) {
if (isProduction) { javascript.pipe(stripDebug()).pipe(uglify()); } javascript.pipe(babel());
}
if (isProduction) {
javascript.pipe(stripDebug()).pipe(uglify());
}
return javascript.pipe(gulp.dest("public/js/")); return javascript.pipe(gulp.dest("public/js/"));
} }
// Task for public styles // Task for public styles
gulp.task("sass-public", function() { gulp.task("sass-public", () => {
return processSass("app"); return processSass("app");
}); });
// Task for dashboard styles // Task for dashboard styles
gulp.task("sass-dashboard", function() { gulp.task("sass-dashboard", () => {
return processSass("dashboard"); return processSass("dashboard");
}); });
// Task for public vue // Task for public vue
gulp.task("js-public-vue", function() { gulp.task("js-public-vue", () => {
return processVue("app-vue", vuePublic); return processVue("app-vue", vuePublic);
}); });
// Task for public javascript // Task for public javascript
gulp.task("js-public", function() { gulp.task("js-public", () => {
return processJavaScript("app", jsPublic, true); return processJavaScript("app", jsPublic, true);
}); });
// Task for public javascript libraries // Task for public javascript libraries
gulp.task("js-public-libs", function() { gulp.task("js-public-libs", () => {
return processJavaScript("lib", jsPublicLibs, false); return processJavaScript("lib", jsPublicLibs, false);
}); });
// Task for dashboard javascript // Task for dashboard javascript
gulp.task("js-dashboard", function() { gulp.task("js-dashboard", () => {
return processJavaScript("dashboard", jsDashboard, true); return processJavaScript("dashboard", jsDashboard, true);
}); });
// Task for dashboard javascript libraries // Task for dashboard javascript libraries
gulp.task("js-dashboard-libs", function() { gulp.task("js-dashboard-libs", () => {
return processJavaScript("lib-dashboard", jsDashboardLibs, false); return processJavaScript("lib-dashboard", jsDashboardLibs, false);
}); });
// Task to copy fonts // Task to copy fonts
gulp.task("fonts", function() { gulp.task("fonts", (done) => {
return gulp.src(fontPaths) gulp.src(fontPaths)
.pipe(plumber(handleError)) .pipe(plumber(handleError))
.pipe(gulp.dest("public/fonts/")); .pipe(gulp.dest("public/fonts/"));
done();
}); });
// Task to run tasks when their respective files are changed // Task to watch files and run respective tasks when changes occur
const watchReload = function(done) { gulp.task("watch", () => {
const browserSyncReload = (done) => {
browserSync.reload(); browserSync.reload();
done(); done();
}; };
gulp.task("js-public-watch", [ "js-public" ], watchReload);
gulp.task("js-public-vue-watch", [ "js-public-vue" ], watchReload);
gulp.task("js-dashboard-watch", [ "js-dashboard" ], watchReload);
gulp.task("watch", function() {
browserSync.init({ browserSync.init({
logLevel: "silent", logLevel: "silent",
baseDir: "./public", baseDir: "./public",
notify: false,
ghostMode: { ghostMode: {
clicks: true, clicks: true,
@ -195,15 +204,17 @@ gulp.task("watch", function() {
} }
}); });
gulp.watch(jsPublic, [ "js-public-watch" ]); gulp.watch([ "app/**/*.php", "routes/**/*.php", "resources/views/**/*.blade.php" ], gulp.series(browserSyncReload));
gulp.watch(jsDashboard, [ "js-dashboard-watch" ]); gulp.watch([ vuePublic, "resources/assets/js/mixins/**/*.js", "resources/components/**/*.vue" ], gulp.series("js-public-vue", browserSyncReload));
gulp.watch([ "app/**/*.php", "routes/**/*.php", "resources/views/**/*.blade.php" ]).on("change", browserSync.reload); gulp.watch(jsPublic, gulp.series("js-public", browserSyncReload));
gulp.watch([ vuePublic, "resources/assets/js/mixins/**/*.js", "resources/components/**/*.vue" ], [ "js-public-vue-watch" ]); gulp.watch(jsPublicLibs, gulp.series("js-public-libs", browserSyncReload));
gulp.watch("resources/assets/sass/**/*.scss", [ "sass-public", "sass-dashboard" ]); gulp.watch(jsDashboard, gulp.series("js-dashboard", browserSyncReload));
gulp.watch(jsDashboardLibs, gulp.series("js-dashboard-libs", browserSyncReload));
gulp.watch("resources/assets/sass/**/*.scss", gulp.parallel("sass-public", "sass-dashboard"));
}); });
// Task to run non-development tasks // Task to run non-development tasks
gulp.task("default", [ gulp.task("default", gulp.parallel(
"sass-public", "sass-public",
"sass-dashboard", "sass-dashboard",
"js-public-vue", "js-public-vue",
@ -212,4 +223,4 @@ gulp.task("default", [
"js-dashboard", "js-dashboard",
"js-dashboard-libs", "js-dashboard-libs",
"fonts" "fonts"
]); ));

View file

@ -1,7 +1,7 @@
#!/usr/bin/env bash #!/usr/bin/env bash
# Dependencies # Dependencies
deps=('bower' 'composer' 'egrep' 'gulp' 'npm' 'php' 'sed') deps=('bower' 'composer' 'egrep' 'npm' 'php' 'sed')
# Default settings # Default settings
no_artisan=0 no_artisan=0
@ -37,7 +37,7 @@ declare -a missing_deps=()
for dep in "${deps[@]}"; do for dep in "${deps[@]}"; do
type -P "$dep" >/dev/null \ type -P "$dep" >/dev/null \
|| missing_deps=( ${missing_deps[@]} "$dep" ) || missing_deps=( "${missing_deps[@]}" "$dep" )
done done
[[ -n "${missing_deps[*]}" ]] && { [[ -n "${missing_deps[*]}" ]] && {
@ -104,7 +104,7 @@ msg "Running: ${c_m}bower prune && bower install"
bower prune && bower install || error "${c_m}bower prune && bower install$c_w exited with an error status" bower prune && bower install || error "${c_m}bower prune && bower install$c_w exited with an error status"
msg "Running: ${c_m}gulp --production" msg "Running: ${c_m}gulp --production"
gulp --production || error "${c_m}gulp --production$c_w exited with an error status" "$(npm bin)/gulp" --production || error "${c_m}gulp --production$c_w exited with an error status"
(( artisan_down )) && { (( artisan_down )) && {
msg "Running: ${c_m}php artisan up" msg "Running: ${c_m}php artisan up"

1956
package-lock.json generated

File diff suppressed because it is too large Load diff

View file

@ -19,12 +19,12 @@
"fancy-log": "^1.3.2", "fancy-log": "^1.3.2",
"font-awesome": "^4.7.0", "font-awesome": "^4.7.0",
"gsap": "^1.20.4", "gsap": "^1.20.4",
"gulp": "^3.9.1", "gulp": "^4.0.0",
"gulp-babel": "^7.0.1", "gulp-babel": "^7.0.1",
"gulp-concat": "^2.6.1", "gulp-concat": "^2.6.1",
"gulp-plumber": "^1.2.0", "gulp-plumber": "^1.2.0",
"gulp-postcss": "^7.0.1", "gulp-postcss": "^7.0.1",
"gulp-sass": "^4.0.0", "gulp-sass": "^4.0.1",
"gulp-sass-glob": "^1.0.9", "gulp-sass-glob": "^1.0.9",
"gulp-strip-debug": "^3.0.0", "gulp-strip-debug": "^3.0.0",
"gulp-uglify": "^3.0.0", "gulp-uglify": "^3.0.0",