Skip to content

Instantly share code, notes, and snippets.

@teyepe
Last active May 21, 2016 19:34
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save teyepe/f307532f43e6a638723f339d6fdcc9c0 to your computer and use it in GitHub Desktop.
Save teyepe/f307532f43e6a638723f339d6fdcc9c0 to your computer and use it in GitHub Desktop.
QuickStart for gulp with a better error handling
// 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