Being synchronous with gulp

Working on a project at work today I ran into an issue with gulp where I need to run a build task that ran a group of other tasks in a very specific order.

The first problem I ran into is that gulp really doesn’t support this “easily”. You can’t really say “this command is a synchronous task don’t run it in parallel with other commands”. Fortunately one of our designers Drew keeps a pretty rad collection of reusable gulp tasks on GitHub that exposed me to run-sequence.

The syntax is simple and straight forward:

// ...
var run = require('run-sequence');
// ...

gulp.task('build', function() {
  run(['css', 'js', 'condense']);

Enter second problem. js is using gulp-shell and for some reason, staying asynchronous. This is causing condense to run and finish before js has had the opportunity to finish. I still haven’t quite figured out the problem, but I did find a temporary solution.

Something gulp does support is setting a task that needs to be run before the task being called runs:

gulp.task('condense', ['js'], function() {
  // ...

This will make gulp run js first, then it will run itself.

The problem I’ve had is probably a weird problem I can fix with a little refactoring, but learning the sequencing methods was fairly helpful.