如何使用gulp和浏览器同步创建简单的html live reload

Question

我是刚开始使用Gulp（尤其是Gulp 4），刚开始我只是想对index.html文件（在根文件夹中）的任何更改进行非常基本的实时重载。到目前为止，我有这个：

var gulp = require("gulp"),
browserSync = require("browser-sync").create();

// Static server
gulp.task('browser-sync', function() {
    browserSync.init({
        server: {
            baseDir: "./"
        }
    });
});

gulp.task('default', ['html'], function() {
    // watch for HTML changes
    gulp.watch('*.html', function() {
       // run styles upon changes
       gulp.run('html');
    });
 });

我如何将浏览器同步任务与gulp watch连接起来？我曾尝试使用官方文档，但示例似乎比我试图实现的要复杂。

Answer 1

更改为：

gulp.task('default', gulp.series('html', function() {
  // watch for HTML changes
  gulp.watch('*.html', gulp.series('html'))
}));

并查看如何从gulp v3迁移到v4指南，因为您将找到的大多数代码都是v3。