Gulp从3升级至4.0.2后任务执行顺序不符合预期问题咨询

问题原因 #

你遇到的问题都是Gulp v3和v4的任务定义语法差异导致的，具体错误点如下：

• 第一次升级后的写法错误：Gulp v4 已经移除了v3版本中gulp.task(任务名, 依赖数组, 执行函数)的三参数签名，仅支持gulp.task(任务名, 任务执行函数/组合任务)的双参数写法。你写的gulp.task('a',gulp.series('b'),function a(){})里第三个参数的a业务函数会被直接忽略，a任务和b任务并行执行，因此顺序错乱。
• 第二次修改的错误：你把a业务函数放到gulp.series参数里，但函数名和外层的a任务名重名，导致Gulp重复识别触发a任务，出现重复日志。
• 第三次修改后的日志是正常表现：最开头的starting a只是Gulp标记你调用的根任务启动，并没有执行a的业务逻辑，实际业务执行顺序已经是b完全执行结束后，才会运行a的业务逻辑（也就是你命名的a1函数），已经符合你的核心需求，只是多了子任务的日志输出。

正确配置方案 #

方案1：沿用gulp.task写法（无多余子任务日志） #

直接给gulp.series传入匿名函数作为a的业务逻辑，Gulp不会给匿名子任务打印独立日志，效果最接近v3的使用体验：

gulp.task('b', function(){
  return // 你的b任务逻辑
});

gulp.task('a', gulp.series('b', function(){
  return gulp.src(/* 你的a业务逻辑 */)
}));

执行gulp a后的日志如下：

• starting 'a'
• starting 'b'
• finished 'b'
• finished 'a'

注：开头的starting 'a'只是根任务启动标记，没有运行任何a的业务代码，实际a的业务逻辑是在b执行完成后才运行的，完全满足你的要求。

方案2：Gulp v4官方推荐写法（更易维护） #

Gulp v4更推荐用函数定义+导出的方式声明任务，不需要用gulp.task注册：

// 定义b任务逻辑
function b() {
  return // 你的b任务逻辑
}

// 定义a业务逻辑
function aTask() {
  return gulp.src(/* 你的a业务逻辑 */)
}

// 导出a任务为b->aTask的串行任务
exports.a = gulp.series(b, aTask)

内容的提问来源于stack exchange，提问作者rohini dingankar