Gulp 任务中`return` 语句和`callback` 引用的目的

Question

我在让 gulprun-sequence执行我给它的两个函数时遇到了麻烦（它只会执行其中一个。我有这样的事情：

gulp.task('wire', function(){
  gulp.src('./index.html')
    .pipe(wiredep())
    .pipe(gulp.dest('.'));
});

var filesToInject = ['./app/**/*.js', './app/**/*.css'];
gulp.task('inject', function (){
  var target = gulp.src('./index.html');
  var sources = gulp.src(filesToInject, {read: false});
  return target.pipe(inject(sources))
    .pipe(gulp.dest('.'));
});

gulp.task('wire-inject',  function(callback){
    sequence('wire', 'inject', callback);
});

那只会运行inject任务。只有当我在任务中添加returnbeforegulp.src时wire它才会执行。我还在两个函数参数中添加了回调，并根据文档将其传递到两个任务中的最后一个管道。

gulp.task('wire', function(callback){
  gulp.src('./index.html')
    .pipe(wiredep())
    .pipe(gulp.dest('.'), callback);
});

var filesToInject = ['./app/**/*.js', './app/**/*.css'];
gulp.task('inject', function (callback){
  var target = gulp.src('./index.html');
  var sources = gulp.src(filesToInject, {read: false});
  return target.pipe(inject(sources))
    .pipe(gulp.dest('.'), callback);
});

这并没有引发任何错误，但是如果我将其取出，它不会改变任何内容。这个 return 语句做了什么神奇地让我的序列完全运行。文档中的这些回调是什么，我只是传递了一个不带括号的引用来执行它们？即使它们似乎什么都不做，我还需要它们吗？

Answer 1

Gulp 需要知道异步任务何时完成。您有 3 种方法可以做到这一点：

1. 返回一个事件流，这是您return gulp.src(...).pipe(...);在任务函数中执行的操作。

2. 返回一个承诺。

3. 具有定义您任务的函数带参数。Gulp 将使用回调调用您的函数，您应该在任务结束时调用该回调。

如果你不这样做，那么 Gulp 就不会知道任务是异步的。因此，它会在其函数返回后立即认为任务已完成。这会产生各种后果。Gulp 可以在任务完成之前退出。或者它可以在任务 A 完成之前启动依赖于任务 A 的任务 B。在某些情况下，您可能不会立即看到问题，但是随着您的 gulpfile 变得越来越复杂，您就有更多机会出现不良行为。run-sequence并不特别：它需要知道任务何时完成才能正确完成工作。

请注意，callback您在问题中显示的这段代码是无用的：

return target.pipe(inject(sources))
    .pipe(gulp.dest('.'), callback);

callback不会被调用。将其替换为function () { console.log("Hello!"); callback(); }. 您不会Hello!在控制台上看到，因为没有调用回调。但是，代码确实可以正常工作，因为您返回了流。Gulp 使用您返回的流来确定任务结束，而不是回调（无论如何都不会调用）。