如何使用Gulp 4 async / await？

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

我能夠在這里和這里得到幫助。

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

在我的實際任務中，我不得不使用finish事件而不是end事件（參見上面的第二個鏈接）。

這一切都運作起來並不是很清楚，但我認為這有點像：

1. Gulp函數是異步的，因此需要等待它們，但由於它們不是承諾，因此必須將它們包裝在一起。
2. 為了解決這個問題，你需要監聽end或finish事件，以及哪一個取決於最后一個管道返回的內容。

在通常需要finish情況下，似乎有效的另一個選項是resume()后跟on("end") 。 這可能是因為這個原因 。 我不確定哪個選項更好。

我希望更多地了解這一點，所以如果您能夠用簡單的術語解釋這一點，請隨時發表評論或發布答案。

編輯：您也可以返回承諾，而不是等待它。