javascript - browsersync 仅在浏览器是事件窗口时刷新

Question

我有浏览器同步设置并通过 gulp 运行。尽管当浏览器是事件且选定的窗口时它会自动刷新，但如果不是，则不会。

这意味着我无法将编辑器和浏览器并排放置，并且在编辑器中更改代码时无法在浏览器上看到持续更新。我一直需要选择浏览器才能看到更新。是否可以在不将浏览器作为事件窗口的情况下使其工作。(在 macOS Sierra 上)。

gulpfile 任务:

// Browser sync server for live reload
gulp.task('browserSync', function () {
    browserSync.init(
        [paths.css + "/**/*.css", paths.js + "*.js", paths.templates + '*.html'], {
            proxy: "localhost:8000",
            browser: 'chrome'
        });

......

// Watch
gulp.task('watch', ['default'], function () {

    // gulp.watch(paths.sass + '/*.scss', ['styles']);
    gulp.watch(paths.less + '/**/*.less', ['styles']);
    gulp.watch(paths.js + '/*.js', ['scripts']).on("change", reload);
    gulp.watch(paths.images + '/*', ['imgCompression']);
    gulp.watch(paths.templates + '/**/*.html').on("change", reload);

});

Answer 1

看来您的问题不是代码本身，而是您需要在编辑器中保存以启动 gulp 任务这一事实。

解释一些编辑器会在指定的情况下为您进行保存。例如，WebStorm 仅在停止写入并等待指定时间进行保存时和/或当焦点从应用程序转移到另一个应用程序时才会自动保存，一旦焦点转移，就会触发保存，并且 gulp 可以拾取这些更改，进而更新 browsersync。

希望有帮助。