Gulp任务调用问题：如何正确调用常量中声明的任务？

嘿，我知道你遇到的问题啦！你用&&来合并任务数组的写法是错的，这就是为什么部分任务没执行的原因。

问题出在哪？ #

&&是JavaScript里的逻辑与运算符，它不会帮你把多个数组合并成一个新数组。当你写INIT && DEV时，因为INIT是一个非空数组（属于“真值”），所以这个表达式会直接返回DEV数组；同理INIT && DEV && RELEASE会只返回RELEASE数组。这就导致你的default任务实际只执行了DEV里的任务，release任务只执行了RELEASE的任务，完全忽略了前面的INIT和DEV。

正确的写法 #

Gulp的任务依赖需要接收一个任务名称组成的数组，所以你需要把多个数组合并成一个新数组，有两种常用方式：

方式1：ES6扩展运算符（简洁直观）

// 任务初始化
const INIT = ['tree', 'media', 'concat'];
const DEV = ['uglify', 'xml', 'watch'];
const RELEASE = ['thumbnails', 'zip'];

gulp.task('init', INIT);
// 合并INIT和DEV的所有任务
gulp.task('default', [...INIT, ...DEV]);
// 合并INIT、DEV、RELEASE的所有任务
gulp.task('release', [...INIT, ...DEV, ...RELEASE]);

方式2：数组的concat方法（兼容旧版JS）

// 任务初始化
const INIT = ['tree', 'media', 'concat'];
const DEV = ['uglify', 'xml', 'watch'];
const RELEASE = ['thumbnails', 'zip'];

gulp.task('init', INIT);
// 合并INIT和DEV
gulp.task('default', INIT.concat(DEV));
// 合并三个数组
gulp.task('release', INIT.concat(DEV).concat(RELEASE));

额外提醒：Gulp 4+的差异 #

如果你用的是Gulp 4及以上版本，直接传数组作为依赖的写法已经被废弃了，需要用gulp.series（串行执行任务）或gulp.parallel（并行执行任务）来明确任务的执行顺序：

// 串行执行所有任务（按顺序一个接一个跑）
gulp.task('default', gulp.series(...INIT, ...DEV));
// 并行执行所有任务（同时跑）
gulp.task('default', gulp.parallel(...INIT, ...DEV));

这样修改后，所有依赖的任务就能正常执行啦！

内容的提问来源于stack exchange，提问作者Luis Alemañó