Gulp：观看HTML个文件，做一些任务，然后browserSync.reload

Question

我们的 HTML 文件是 'assembled' 来自几个 template/partial HTML 文件。现在我希望 Gulp 能够按顺序:

完成这些任务

观看 'template' HTML 个文件
如果有任何更新，运行任务pages
然后，刷新网页。

我通读了本教程：https://www.browsersync.io/docs/gulp/。但它只是监视 HTML 文件并重新加载。我试过这个：

gulp.watch([
    path.join(dpw.src.commonLayouts, 'layout.html'),
    dpw.src.commonPages + "/**/*.html",
    dpw.src.sitePages + "/**/*.html"
], ['pages']).on("change", browserSync.reload);

网页将自动重新加载。而任务pages是运行.

但是，刷新后的页面总是落后一个版本。这意味着，如果我将某些文本从“12”更改为“123”，页面会刷新，但文本为“12”。然后我改成“1234”，页面刷新为“123”...

我正在使用 Gulp 3.9.0 和 browser-sync 2.11.1。

请帮忙。谢谢。

Answer 1

感谢@MatthewRath，我使用 runSequence:

实现了它

gulp.task('pages-watch', function () {
    runSequence('pages', browserSync.reload);
});

gulp.watch([
    path.join(dpw.src.commonLayouts, 'layout.html'),
    dpw.src.commonPages + "/**/*.html",
    dpw.src.sitePages + "/**/*.html"
], ['pages-watch']);

但是引入了新的任务，有点乏味

Gulp：观看HTML个文件，做一些任务，然后browserSync.reload

Gulp: watch HTML files, do some task, then browserSync.reload

gulp

gulp-watch

browser-sync