Gulp:观看HTML文件,执行一些任务,然后浏览BrowserSync.reload

时间:2016-02-16 05:52:14

标签: gulp gulp-watch browser-sync

我们的HTML文件是从几个模板/部分HTML文件中“汇编”而来的。现在我希望Gulp能够完成顺序

这些任务
  1. 观看'模板'HTML文件
  2. 如果有任何更新,请运行任务pages
  3. 然后,刷新网页。
  4. 我通读了这个教程: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。

    请帮忙。感谢。

1 个答案:

答案 0 :(得分:0)

感谢@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']);

但它引入了一项新任务,这有​​点单调乏味。