Last active
May 21, 2016 19:34
-
-
Save teyepe/f307532f43e6a638723f339d6fdcc9c0 to your computer and use it in GitHub Desktop.
QuickStart for gulp with a better error handling
This file contains 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
// Include gulp | |
var gulp = require('gulp'); | |
// Include Plugins | |
var jshint = require('gulp-jshint'); | |
var sass = require('gulp-sass'), | |
neat = require('node-neat').includePaths; | |
var minifyCSS = require('gulp-minify-css'); | |
var autoprefixer = require('gulp-autoprefixer'); | |
var concat = require('gulp-concat'); | |
var uglify = require('gulp-uglify'); | |
var rename = require('gulp-rename'); | |
var imagemin = require('gulp-imagemin'); | |
var pngquant = require('imagemin-pngquant'); | |
var changed = require('gulp-changed'); | |
var plumber = require('gulp-plumber'); | |
var paths = { | |
scss : ['./assets/styles/sass/**/*.scss','./assets/styles/sass/base/**/*.scss'], | |
css : './assets/styles/css', | |
js : './assets/js/*.js', | |
img : './assets/img/*' | |
}; | |
// Lint Task | |
gulp.task('lint', function() { | |
return gulp.src(paths.js) | |
.pipe(jshint()) | |
.pipe(jshint.reporter('default')); | |
}); | |
// Compile Sass | |
gulp.task('sass', function() { | |
return gulp.src(paths.scss) | |
.pipe(plumber({ | |
// better error handler | |
// https://github.com/gulpjs/gulp/issues/259 | |
errorHandler: function (err) { | |
console.log(err.message); | |
this.emit('end'); | |
} | |
})) | |
.pipe(changed(paths.css)) | |
.pipe(sass({ | |
includePaths: require('node-bourbon').includePaths, | |
includePaths: require('node-neat').includePaths, | |
})) | |
.pipe(autoprefixer( | |
'last 2 version', | |
'safari 5', | |
'ie 8', | |
'ie 9', | |
'opera 12.1', | |
'ios 6', | |
'android 4') | |
) | |
.pipe(plumber.stop()) | |
.pipe(gulp.dest(paths.css)); | |
}); | |
// Concatenate & Minify JS | |
gulp.task('scripts', function() { | |
return gulp.src(paths.js) | |
.pipe(changed('./dist/js')) | |
.pipe(concat('scripts.js')) | |
.pipe(gulp.dest('dist/js')) | |
.pipe(rename('scripts.min.js')) | |
.pipe(uglify()) | |
.pipe(gulp.dest('./dist/js')); | |
}); | |
// Image Optimization | |
gulp.task('imgopt', function () { | |
return gulp.src(paths.img) | |
.pipe(changed('./dist/img')) | |
.pipe(imagemin({ | |
progressive: true, | |
svgoPlugins: [{removeViewBox: false}], | |
use: [pngquant()] | |
})) | |
.pipe(gulp.dest('./dist/img')); | |
}); | |
// Watch Files For Changes | |
gulp.task('watch', function() { | |
gulp.watch(paths.js, ['lint', 'scripts']); | |
gulp.watch(paths.scss, ['sass']); | |
}); | |
// Default Task | |
gulp.task('default', ['lint', 'sass', 'scripts', 'imgopt', 'watch']); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment