javascript - 如何在 Gulp 4 中使用异步/等待？

Question

我正在尝试做这样的事情:

gulp.task("test", async () => {
    return gulp.src("**/*.scss")
        .pipe(print((filePath) => `File: ${filePath}`));
});

(打印为gulp-print)

但它给出了以下内容:

[22:08:43] Starting 'test'...
[22:08:43] Finished 'test' after 12 ms
[22:08:43] File: src\app\styles\app.scss
[22:08:43] File: src\app\styles\test.scss

即它在打印消息之前完成。

我正在使用 Gulp 4(我认为是 alpha 2)和 TypeScript (1.8.0-dev.20151204)。

生成的 (ES6) 代码如下所示:

gulp.task("test", () => __awaiter(this, void 0, Promise, function* () {
    return gulp.src("**/*.scss")
        .pipe(print((filePath) => `File: ${filePath}`));
}));

__awaiter 是:

var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, Promise, generator) {
    return new Promise(function (resolve, reject) {
        generator = generator.call(thisArg, _arguments);
        function cast(value) { return value instanceof Promise && value.constructor === Promise ? value : new Promise(function (resolve) { resolve(value); }); }
        function onfulfill(value) { try { step("next", value); } catch (e) { reject(e); } }
        function onreject(value) { try { step("throw", value); } catch (e) { reject(e); } }
        function step(verb, value) {
            var result = generator[verb](value);
            result.done ? resolve(result.value) : cast(result.value).then(onfulfill, onreject);
        }
        step("next", void 0);
    });
};

有没有可能让这个工作？我想在我的任务函数中使用 await，但如果不将该函数标记为异步，我将无法执行此操作。

我可能遗漏了一些明显的东西。

Answer 1

在 here 的帮助下，我能够完成这项工作和 here .

gulp.task("test", async () => {
    await new Promise((resolve, reject) => {
        gulp.src("**/*.scss")
            .pipe(print((filePath) => `File: ${filePath}`))
            .on("end", resolve);
    });
});

在我的实际任务中，我不得不使用 finish 事件而不是 end 事件(参见上面的第二个链接)。

这一切是如何运作的还不是很清楚，但我认为这与以下几条线类似:

1. Gulp 函数是异步的，因此需要等待它们，但由于它们不是 promises，因此您必须将它们包装在一个中。
2. 为了解决 promise ，您需要监听 end 或 finish 事件，具体哪个取决于最后一个管道返回的内容。<

另一个似乎有效的选项是 resume() 后跟 on("end")，在通常需要 finish 的情况下.这可能是因为 this .我不确定哪个选项更好。

我很想更深入地了解这一点，所以如果您能够用简单的术语解释这一点，请随时发表评论或发布答案。

编辑:您也可以返回 promise ，而不是等待它。