Don’t forget to Watch Gulp

When I first switched from Grunt to Gulp about 4 months ago I was instantly delighted. Gulp — http://gulpjs.com — is fast, easy to use and customize and flexible. But one of the most important aspects is not included out of the box. Error Handling.

When using Gulp Watch if you have an error in your source code Gulp will fail and you’ll have no idea. You’ll be sitting there, as I was, for hours scratching you head while your console is trying to silently scream at you in the background.

The solution is Gulp Plumber — https://www.npmjs.org/package/gulp-plumber. Add this to each stream and you can create a custom error handler for every Gulp method. Here is how my default typical setup looks:

var plumber = require('gulp-plumber');
var gutil = require('gulp-util');
var onError = function(err) {
  gutil.beep();
  console.error("You did something wrong, NERD! " + err.message);
}
gulp.task('less', function() {
  gulp.src('app/src/less/main.less')
  .pipe(plumber({
    errorHandler: onError
  }))
  .pipe(less({
    paths: [path.join(__dirname, 'less', 'includes')],
    sourceMap: true
  }))
 .pipe(gulp.dest('app/release/styles'))
});

Save the Gist.