node.js - 按顺序运行 gulp 任务会抛出 `Unhandled stream error in pipe`

Question

我有一个 gulp 任务如下:

gulp.task('build-files, function(cb) {
    runSequence('run-build-cmd',
        'delete-dest', 'copy-files',
        cb);
});

只要源文件夹中发生如下更改，此任务就会运行:

gulp.watch(pathToSrcFolder, ['build-files']);

因此此任务按指定顺序运行其他 3 个 gulp 任务，第一个运行构建命令，第二个将删除文件夹，如下所示:

gulp.task('delete-dest', (cb) => {
    del([pathToDestFolder], {force: true});
    cb();
});

第三个将文件从源复制到两个目的地:

gulp.task('copy-files', () => {
    return gulp.src(pathToSrcFolder)
        .pipe(gulp.dest(pathToDestFolder))
        .pipe(gulp.dest(anotherPath));
});

请注意 pathToDestFolder 在 delete-source 和 copy-files 命令中是同一个文件夹。

我运行这个序列的问题是这个错误:

internal/streams/legacy.js:59
      throw er; // Unhandled stream error in pipe.
      ^

Error: ENOENT: no such file or directory, chmod 'pathToDestFolder\path\to\some\file\file.ext'

我不知道为什么会出现此错误。

当我在 cmd 提示符下运行 gulp delete-dest(这将清除 pathToDestFolder)，然后运行 ​​gulp copy-files(这会将源文件夹复制到两个文件夹 pathToDestFolder 和 anotherPath)它按预期工作。

所以我猜 runSequence 没有按预期工作？如果是这样，我该如何解决？

编辑:

我尝试使用 rimraf 而不是 del，一切似乎都工作得很好，我知道 rimraf 被贬低了，它是最好改用 del，但为什么 del 在这种情况下会导致异常？

编辑 2:

我没有使用 rimraf 作为解决方案，而是尝试了这个解决方案:

gulp.task('delete-dest', (cb) => {
    del([pathToDestFolder], {force: true})
    .then(paths => {cb();});
});

它就像魔术一样奏效。

为什么这反而奏效了？我不知道!

如果有人能澄清一些事情，我将不胜感激。

Answer 1

如果你看here ，您会发现 del 返回一个 promise 。这是一个异步方法。

在您的代码中，您在调用 del(...) 之后立即调用 cb()，但在 del 之前实际上完成删除目录。

这就是为什么你必须在使用 then 链接后​​执行回调:

gulp.task('delete-dest', (cb) => {
    del([pathToDestFolder], {force: true})
    .then(paths => {cb();});
});

然后您的操作将以正确的顺序运行。

您之前遇到的错误是事物以奇怪的顺序运行的结果，导致了奇怪的行为。 Gulp 正在尝试复制到一个目录，而文件系统正在删除它，这种冲突会导致文件系统错误。

---

作为实验，您可以像这样尝试运行 del 的同步版本:

gulp.task('delete-dest', (cb) => {
    del.sync([pathToDestFolder], {force: true});
    cb();
});

看看是否可行(尽管您应该更喜欢异步版本)。

---

作为旁注，除非这是 Gulp 4 的一个特性，但可能不是，而不是在您的任务中调用回调，您可以像这样返回一个 promise :

gulp.task('delete-dest', () => {
    return del([pathToDestFolder], {force: true});
});

这将告诉 Gulp 您的任务已完成，它可以继续进行下一个任务。