在浏览器同步中自动重新加载不起作用答案

【问题标题】：Auto reload in browsersync not working在浏览器同步中自动重新加载不起作用
【发布时间】：2017-07-09 06:53:52
【问题描述】：

我尝试了许多代码变体，但 home.html 只加载一次，当我更改 css 文件夹中的 Style.css 文件时，它不会自动重新加载。我试过这个

var gulp = require('gulp');
var browserSync = require('browser-sync').create();
var reload = browserSync.reload() 
gulp.task('serve', function () {

      browserSync.init({
        server: {

          baseDir: "./",
     index: "./main/home.html"
        },
    });
    gulp.watch("/css/Style.css", [reload])

});

和

var gulp = require('gulp');
var browserSync = require('browser-sync').create();
var reload = browserSync.reload("./main/home.html")
gulp.task('serve', function () {

      browserSync.init({
        server: {

          baseDir: "./",
     index: "./main/home.html"
        },
    });
    gulp.watch("/css/Style.css", [reload])

});

和

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

gulp.task('serve', function () {

      browserSync.init({
        server: {

          baseDir: "./",
     index: "./main/home.html"
        },
    });
    gulp.watch("./css/Style.css").on("change", browserSync.reload);
});

知道我做错了什么吗？

【问题讨论】：

标签： browser-sync gulp-browser-sync

【解决方案1】：

改变这个：

var reload = browserSync.reload()

到

var reload = browserSync.reload;

您的第三个版本应该适用于以下更改：

gulp.watch("./css/Style.css").on("change", reload);

【讨论】：