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中触发一次，但不会在后续更改中触发

1 个答案: