Run gulp task after completion of other task

Question

I have two sets of files, let's call them base and mods. The mods files override the base files, so when I run the gulp task related to base, I need to run the mods task directly after. My setup is something like this:

gulp.task('base',function(){
  return gulp.src('base-glob')
    .pipe(...)
    .pipe(gulp.dest('out-glob'))
});

gulp.task('mods',function(){
  return gulp.src('mods-glob')
    .pipe(...)
    .pipe(gulp.dest('out-glob'))
});

So I want to run the mods task at the completion of the base task. Note that this is not the same as defining base as a dependency of mods, because if I'm only changing mods files, I only need to run the mods task. I'd prefer not to use a plugin.

I've been reading the docs about callback functions and other suggestions of synchronous tasks, but can't seem to get my head around it.

You have conflicting requirements. You want `mods` to run AFTER `base` but you only want `mods` to run by itself if only `mods` files are changed? That doesn't make sense exactly. — Jake Wilson, Feb 09 '15 at 19:13
Sorry I wasn't clear. I have two use cases: when `base` files change, I want to run `base` then `mods`. When `mods` files change I only want to run `mods`. — nvioli, Feb 09 '15 at 19:17
I figured as much just wanted to make sure. See my answer below. — Jake Wilson, Feb 09 '15 at 19:20
possible duplicate of [How to run Gulp tasks synchronously/one after the other](http://stackoverflow.com/questions/22824546/how-to-run-gulp-tasks-synchronously-one-after-the-other) — Andrew Marshall, Jun 15 '15 at 17:50

Jake Wilson · Accepted Answer · 2015-02-11T17:33:42.110

I know you don't want to use a plugin, but gulp doesn't have a way to run a sequence of tasks in order without a plugin. Gulp 4 will, but in the meantime the stopgap solution is the run-sequence plugin.

gulp.task('all', function() {
  runSequence('base', 'mods');
});

This ensures that the tasks run in order as opposed to unordered dependencies.

Now setup a watch:

gulp.task('watch', function() {
    gulp.watch('base-glob', ['all']);
    gulp.watch('mods-glob', ['mods']);
});

Whenever base-glob changes, gulp will run all task, which will run the sequence base then mods.

Whenever mods-glob changes, gulp will run only mods task.

That sound about right?

that worked for me, thank you!! worth noting there is a newer version of **gulp-run-sequence** which is called just [run-sequence](https://www.npmjs.com/package/run-sequence) — mikhail-t, Feb 11 '15 at 16:05

score 0 · Answer 2 · answered May 24 '17 at 22:24

runSequence has some weird bugs, it kept complaining that my tasks are not defined.

If you look into the Orchestrator source, particularly the .start() implementation you will see that if the last parameter is a function it will treat it as a callback.

I wrote this snippet for my own tasks:

  gulp.task( 'task1', () => console.log(a) )
  gulp.task( 'task2', () => console.log(a) )
  gulp.task( 'task3', () => console.log(a) )
  gulp.task( 'task4', () => console.log(a) )
  gulp.task( 'task5', () => console.log(a) )

  function runSequential( tasks ) {
    if( !tasks || tasks.length <= 0 ) return;

    const task = tasks[0];
    gulp.start( task, () => {
        console.log( `${task} finished` );
        runSequential( tasks.slice(1) );
    } );
  }
  gulp.task( "run-all", () => runSequential([ "task1", "task2", "task3", "task4", "task5" ));

Run gulp task after completion of other task

2 Answers2