BrowserSync 仅在 Gulp 中触发一次，但不会在后续更改时触发

Question

我正在按照本教程进行操作，但是在进行 CSS 更改时无法启动 browserSync。

如果我调用 gulp watch 它会重新加载一次，并且 SASS 会自动编译为 CSS，但是 browserSync 不会在更改时触发。

下面的要点是整个gulpfile.js

https://gist.github.com/RyanNovas/c940324270b57754e487

Answer 1

看来你不见了

var watch  = require('gulp-watch');

不确定为什么不会引发错误。不管怎样

这是下面的 gulpfile 的一部分，其中包含相关内容。

// Gulpfile
var gulp            = require('gulp');
var watch           = require('gulp-watch');

// Server
var browserSync     = require('browser-sync').create();
var reload          = browserSync.reload;

// define the default task, call 'serve'.
gulp.task('default', ['serve']);

// Use BrowserSync to fire up a localhost server and start a livereload. We
// inject CSS changes, and reload fully for javascript and html changes.
// http://www.browsersync.io/docs/options/
gulp.task('serve', ['sass', 'webpack'], function() {

    browserSync.init({
        server: "./",
        notify: false,
        reloadOnRestart: true,
        open: false,
    });

    // scss
    gulp.watch("./css/sass/*.scss", ['sass']);
    gulp.watch("./javascript/app/**/*.scss", ['sass']);
    gulp.watch("./css/styles.css").on('change', reload);

    // html
    gulp.watch("./index.html").on('change', reload);
    gulp.watch("./javascript/app/**/*.html").on('change', reload);

    // js
    gulp.watch('./javascript/app/**/*.js', ['webpack']);
    gulp.watch('./javascript/dist/**/*.js').on('change', reload);

});

working gulpfile 重新加载 browsersync 没有问题

BrowserSync 仅在 Gulp 中触发一次，但不会在后续更改时触发

BrowserSync only firing in Gulp once on watch, but not on subsequent changes

node.js

gulp-watch

browser-sync