Run gulp task after completion of other task

问题

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.

回答1:

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?

回答2:

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" ));

来源：https://stackoverflow.com/questions/28417273/run-gulp-task-after-completion-of-other-task

标签

javascript

gulp

synchronous