wake-up-neo.net

Wie gehe ich mit dem Browser-Cache um, während ich browserSync verwende?

Ich verwende gulp mit browserSync mit der nächsten Konfiguration (vereinfacht):

gulp.task('serve', ['compile_styles'], function() {
    browserSync.init({
        proxy: 'my-local-dev.site'
    });

    gulp.watch('/public/styles/**/*.scss', ['compile_styles']);
    gulp.watch('/public/js/**/*.js').on('change', browserSync.reload);
    gulp.watch('/**/*.php').on('change', browserSync.reload);
});

SCSS-Änderungen werden durch .pipe(browserSync.reload({stream: true})) innerhalb der compile_styles-Aufgabe übertragen, aber wie Sie für .js-Dateien sehen können, habe ich einfachen browserSync.reload verwendet und es funktioniert nicht, weil der Browser ( chrome 57.0.2987.133 (64-bit) ) statische Dateien lädt Da es sich um einen internen Cache handelt, muss ich ein zusätzliches Neuladen durchführen, um diesen Cache zu leeren und den Browser zu zwingen, diese Dateien erneut zu laden.

Dasselbe gilt für statische Ressourcen wie Bilder, Schriftarten usw. Wie wird mit dem Browser-Cache umgegangen, während BrowserSync verwendet wird?

7
Roman Nazarkin

Eine Lösung wurde gefunden, indem der Parameter {stream: true} der Funktion browserSync.reload verwendet wurde. Damit dies funktioniert, sind jedoch einige Änderungen erforderlich. So wie es war:

gulp.watch('/public/js/**/*.js').on('change', browserSync.reload);

und wie sieht es jetzt aus:

gulp.watch('/public/js/**/*.js').on('change', function(e) {
    return gulp.src(e.path)
        .pipe(browserSync.reload({stream: true}));
});
1
Roman Nazarkin

In Chrome Devtools (CTRL MAJ I) im Register Network haben Sie ein Kontrollkästchen Cache deaktivieren . Es sollte funktionieren.

4
Aurélien

warum benutzt du nicht gulp-cache 

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

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

  // Still pass the files to clear cache for
  gulp.src('./lib/*.js')
  .pipe(cache.clear());

  // Or, just call this for everything
  cache.clearAll();

});

und fügen Sie diese Aufgabe dann Ihrem Beobachter hinzu

3
AbdelhakAj