From Grunt to Gulp

Question

I am currently experimenting with converting my Grunt files to Gulp files. My first try was with a quite simple file which simply runs JSHint and Mocha, and has a watch mode. My first result was quite … well … disillusioning.

I encountered several problems, and I hope that there is a way to solve them:

• I realized that Gulp runs all the tasks asynchronously. If I want to wait for a task to finish, the documentation tells me to use a callback, a promise or to return a stream. But how do I do this with gulp-mocha and gulp-jshint? Do these plugins support this?
• A failing gulp-jshint did not fail the build. How do I tell Gulp to stop proceeding if gulp-jshint failed?
• Using watch mode as described in Gulp's getting started guide resulted in a Too many open files error when running gulp. Any idea of what might be wrong?

(Please note that I intentionally did not specify source code here, as the first two questions are general questions, and the last one refers to the default file.)

Any help on this?

Answer 1

Regarding task dependencies, the simplest solution is to return the gulp stream from the task, and depend on that task.

In the code below, if the "server" task does not return the stream, it would be run asynchronously, resulting in the "serve" task attempting to run a server using a non-existing file.

gulp.task('server', function () {
  return gulp.src('server/**/*.coffee')
      .pipe(coffeescript())
      .pipe(gulp.dest('./dist/'));
});

var expressServer;

gulp.task('serve', ['server'], function () {
  var apiServer = require('./dist/server');
  expressServer = apiServer(function (server) {
    server.use(livereload({
      port: livereloadport
    }));

  });

  expressServer.listen(serverport);

  //Set up your livereload server
  lrserver.listen(livereloadport);
});

Answer 2

For the "stop and fail" part:

Here is a functional example with jshint:

var reporter = require('jshint-stylish');
var jshintRc = readJSON('.jshintrc');

// Implement asynchronous support returning the stream
gulp.task('myhinter', function() {
  // All js in src
  return gulp.src('./src/*.js')
    // options from file
    .pipe(jshint(jshintRc))
    // like stylish reporter
    .pipe(jshint.reporter(reporter))
    // Our turn!
    .pipe(map(function (file, cb) {
      // Notify the callback "true" if it failed on the file
      cb(!file.jshint.success, file);
    }));
})

// Now, define thattask to depend on myhinter
gulp.task('thattask', ['myhinter'], function(e) {
  console.warn('thattask is executing');
});

thattask depends on the success of task myhinter.

In turn myhinter does jshint on files, reporter using stylish, and fails if at least one file failed hinting.

Here, this is implemented by returning the stream from the myhinter task.

You can see more about that in the orchestrator documentation: https://github.com/robrich/orchestrator

I don't use mocha, but will take a look later on to see how to do it.

About the too many opened file, are on OSX? If so, maybe see this here if it helps.