Last active
October 7, 2018 10:03
-
-
Save davestewart/1a1d3c59c090928e1b38 to your computer and use it in GitHub Desktop.
Laravel Gulp setup - compiles scripts & styles (plus custom paths and live build option) with live-reload
This file contains hidden or 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
// --------------------------------------------------------------------------------- | |
// libs | |
var gulp = require('gulp'), | |
// tools | |
sass = require('gulp-sass'), | |
uglify = require('gulp-uglify'), | |
sourcemaps = require('gulp-sourcemaps'), | |
livereload = require('gulp-livereload'), | |
// utilities | |
argv = require('yargs').argv, | |
gulpif = require('gulp-if'), | |
rename = require('gulp-rename'), | |
concat = require('gulp-concat'); | |
// --------------------------------------------------------------------------------- | |
// config | |
// paths | |
var src = | |
{ | |
css: 'resources/assets/sass/**/*.scss', | |
js : 'resources/assets/js/**/*.js' | |
}; | |
var trg = | |
{ | |
css: 'public/assets/css/', | |
js : 'public/assets/js/' | |
}; | |
// --------------------------------------------------------------------------------- | |
// sub tasks | |
gulp.task('styles', function () | |
{ | |
return gulp | |
.src(src.css) | |
// source maps for local and staging | |
.pipe(gulpif(!argv.live, sourcemaps.init())) | |
// compress only when live | |
.pipe(sass(argv.live ? {outputStyle: 'compressed'} : null).on('error', sass.logError)) | |
// source maps for local and staging | |
.pipe(gulpif(!argv.live, sourcemaps.write())) | |
// save | |
.pipe(gulp.dest(trg.css)) | |
// livereload | |
.pipe(livereload()); | |
}); | |
gulp.task('scripts', function () | |
{ | |
return gulp | |
.src(src.js) | |
// source maps for local and staging | |
.pipe(gulpif(!argv.live, sourcemaps.init())) | |
// always concat + uglify, but mangle only on live | |
.pipe(uglify({compress: true, mangle: argv.live})) | |
.pipe(concat('all.js')) | |
// source maps only if not live | |
.pipe(gulpif(!argv.live, sourcemaps.write())) | |
// save | |
.pipe(rename({extname: '.min.js'})) | |
.pipe(gulp.dest(trg.js)) | |
// livereload | |
.pipe(livereload()); | |
}); | |
// --------------------------------------------------------------------------------- | |
// main tasks | |
/** | |
* Build styles and scripts | |
* | |
* Call "gulp build --live" to mangle/compress and skip source maps | |
*/ | |
gulp.task('build', function () | |
{ | |
gulp.start('styles', 'scripts'); | |
}); | |
/** | |
* Monitor styles and scripts, and live-reload when saved | |
*/ | |
gulp.task('default', function () | |
{ | |
// live-reload | |
livereload({start: true}); | |
livereload.listen(); | |
// watch | |
gulp.watch(src.css, ['styles']); | |
gulp.watch(src.js, ['scripts']); | |
}); | |
This file contains hidden or 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
{ | |
"private": true, | |
"devDependencies": { | |
"gulp": "^3.9.0", | |
"gulp-concat": "^2.6.0", | |
"gulp-if": "^2.0.0", | |
"gulp-livereload": "^3.8.1", | |
"gulp-rename": "^1.2.2", | |
"gulp-sass": "^2.0.4", | |
"gulp-sourcemaps": "^1.6.0", | |
"gulp-uglify": "^1.4.2", | |
"yargs": "^3.29.0" | |
} | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment