Question

我想定义一个Gulp 4任务，它是由三个串联执行的函数组成的。但是，我想将其定义为命名函数，而不是使用gulp.task()：

function beforeTest() { ... }
function coreTest() { ... }
function afterTest() { ... }

export function test() {
    // what goes here?
    // this function should be equivalent to:
    // gulp.task('test', gulp.series(beforeTest, coreTest, afterTest));
}

我在Gulp GitHub问题跟踪器上发现了一个类似的question，其中OP尝试了相当于以下内容：

export function test() {
    return gulp.series(beforeTest, coreTest, afterTest);
}

GitHub问题解释了这不起作用的原因。 Gulp团队推荐的解决方案是不使用命名函数，而是将复合函数分配给变量：

export const test = gulp.series(beforeTest, coreTest, afterTest);

然而，由于一些原因，这种解决方案似乎有缺陷。

关于GitHub问题的comment中提出的第一个缺陷是关于这对任务排序的限制（由于新的问题，我已经试图通过使用命名函数而不是gulp.task()来避免这种情况在Gulp 4中requirement，任务名称必须在引用之前注册。）

第二个缺点是更具美感（从而触发我的OCD :-)）。运行gulp test时，复合test任务将显示在输出中：

[00:00:00] Starting 'test'...
[00:00:00] Starting 'beforeTest'...
[00:00:00] Finished 'beforeTest' after 106 ms
[00:00:00] Starting 'coreTest'...
[00:00:00] Finished 'coreTest' after 214 ms
[00:00:00] Starting 'afterTest'...
[00:00:00] Finished 'afterTest' after 280 μs
[00:00:00] Finished 'test' after 324 ms

但是，如果我有另一个引用test的复合任务，例如：

gulp.task('build', gulp.parallel(lint, test));

然后当我运行gulp build时，输出中不会显示复合test任务：

[00:00:00] Starting 'build'...
[00:00:00] Starting 'lint'...
[00:00:00] Starting 'beforeTest'...
[00:00:01] Finished 'beforeTest' after 1.08 s
[00:00:01] Starting 'coreTest'...
[00:00:02] Finished 'coreTest' after 977 ms
[00:00:02] Starting 'afterTest'...
[00:00:02] Finished 'afterTest' after 232 μs
[00:00:07] Finished 'lint' after 6.96 s
[00:00:07] Finished 'build' after 6.96 s

我怀疑这可能是因为Gulp没有显示名称为series或parallel的任何功能。我尝试按照GitHub问题中的建议设置test.displayName：

export const test = gulp.series(beforeTest, coreTest, afterTest);
test.displayName = 'test';

但这并没有改变gulp build的输出。我也尝试设置test.name，但该属性似乎已被冻结：

TypeError: Cannot assign to read only property 'name' of function 'function series(done) {
    nowAndLater.mapSeries(args, asyncDone, extensions, done);
  }'

似乎如果我可以将复合test任务定义为命名函数，它将解决这两个缺陷。那么，总之，我如何定义此问题顶部显示的test函数的主体？

Answer 1

export function test(...args) {
    return gulp.series(beforeTest, coreTest, afterTest)(...args);
}

如果任何组件函数需要Gulp任务回调参数（即gulp.series()，cb，等等），函数参数必须传递给done返回的复合函数。

此任务定义在运行gulp build时生成所需的输出：

[00:00:00] Starting 'build'...
[00:00:00] Starting 'lint'...
[00:00:00] Starting 'test'...
[00:00:00] Starting 'beforeTest'...
[00:00:01] Finished 'beforeTest' after 1.06 s
[00:00:01] Starting 'coreTest'...
[00:00:02] Finished 'coreTest' after 949 ms
[00:00:02] Starting 'afterTest'...
[00:00:02] Finished 'afterTest' after 302 μs
[00:00:02] Finished 'test' after 2.05 s
[00:00:07] Finished 'lint' after 7.12 s
[00:00:07] Finished 'build' after 7.12 s

编辑：此解决方案的一个缺点是，通过将调用推迟到gulp.series()，直到test任务实际执行，子任务才会显示在gulp --tasks显示的任务地图。

例如，使用建议的解决方案，gulp --tasks的输出是

[00:00:00] Tasks for ~/gulpfile.babel.js
[00:00:00] └── test

然而，根据原始GitHub问题中的建议将test定义为变量，输出为

[00:00:00] Tasks for ~/gulpfile.babel.js
[00:00:00] └─┬ test
[00:00:00]   └─┬ <series>
[00:00:00]     ├── beforeTest
[00:00:00]     ├── coreTest
[00:00:00]     └── afterTest

对于提出的问题，这不是问题，因为beforeTest，coreTest和afterTest函数不是实际任务（即它们不是export ed），所以我实际上不希望它们出现。但是，因为我很容易看到使用export ed子任务进入相同的情况，我不觉得这个解决方案在理智上完全令人满意。

Gulp 4：如何在函数中使用gulp.series（）和gulp.parallel（）？

1 个答案: