Gulp 4 多个任务在同一个源和系列

【问题标题】：Gulp 4 multiple tasks on same source and in seriesGulp 4 多个任务在同一个源和系列
【发布时间】：2018-03-10 14:09:30
【问题描述】：

我编辑我的 gulpfile 如下：

gulp.task('watch', function() {
    gulp.watch('**/*.html', gulp.series('htmlcomb'));
    gulp.watch('css/**/*.scss', gulp.series('csscomb'));
    gulp.watch('css/**/*.scss', gulp.series('cssmin'));        
    gulp.watch('js/**/*.js', gulp.series('jsmin'));
});

但是当我运行 gulp watch 它在 csscomb 之后停止。当我编辑一个 scss 文件时。它只会梳理它。

我可以异步运行 htmlcomb、jsmin 和 (cssbomb + cssmin)。但是我需要在 csscomb 之后运行 cssmin。

【问题讨论】：

标签： javascript gulp gulp-watch gulp-4

【解决方案1】：

如果您希望 csscomb 在 cssmin 之前运行，只需使用：

gulp.task('watch', function() {
    gulp.watch('**/*.html', gulp.series('htmlcomb'));

    gulp.watch('css/**/*.scss', gulp.series('csscomb', 'cssmin'));

    gulp.watch('js/**/*.js', gulp.series('jsmin'));
});

实际上，如果您使用的是 gulp4.0，您的函数可能是以下形式：

function csscomb() {
  return gulp.src(…...)
    .pipe.....)
    .pipe(gulp.dest(…...));
}

所以您的监视任务正在调用函数 - 而不是任务 - 并且看起来像这样：

gulp.task('watch', function() {
    gulp.watch('**/*.html', gulp.series(htmlcomb));

    gulp.watch('css/**/*.scss', gulp.series(csscomb, cssmin));

    gulp.watch('js/**/*.js', gulp.series(jsmin));
});

【讨论】：