Question

我使用浏览器同步和gulp在项目中每个文件更改时重新加载页面。它可以正常工作：有时我必须按ctrl + F5才能显示页面上的更改，然后我只需要保存以进行下一次更改，并且浏览器同步重新加载就足够了。这是我的代码：

var cache = require('gulp-cache');
var browserSync = require('browser-sync').create();
gulp.task('browser-sync', function() {
    browserSync.init({
        injectChanges: true,
        proxy: "http://localhost:8888/project/source/"
    });
    gulp.watch("source/**/*").on("change", function(e) {
        cache.clearAll();
        return gulp.src(e.path)
            .pipe(browserSync.reload({stream: true}));
    }); 
});

我希望浏览器在项目的每个更改（每个文件夹/子文件夹中的每个文件）都刷新时刷新。

我认为将stream参数设置为true可以找到另一个主题来完成这项工作，但是我仍然遇到相同的问题...而且gulp clear缓存不会改变任何内容。

每次保存时，页面都会刷新，但更改不会始终显示，因此我必须使用ctrl + F5进行强制刷新。

这是一个小项目，这就是为什么我不想使用webpack。它在MAMP服务器上。

有什么想法吗？

Answer 1

最可能的罪魁祸首是资产缓存。硬重装会从浏览器中删除所有缓存的数据，还会取消注册服务人员，indexeddb等。

进入devtools，单击“应用程序”选项卡，选择Service Worker，然后选中“重新加载时更新”框。我很确定这会在刷新页面时重新加载。

用gulp和浏览器同步强制刷新

1 个答案: