browsersync recharge la page en chrome, mais ne montre pas les changements

Question

Dans ma tâche gulp j'utilise browsersync, mais depuis un moment, le chrome ne rafraîchit pas le css. J'utilise browsersync avec Safari et Chrome. Dans le passé, tout allait bien, je n'ai pas changé les réglages de la gorgée. Dans Safari, le rechargement fonctionne comme prévu, dans Chrome, je peux voir le rechargement de la page, ainsi que le message «Connecté à BrowserSync» dans le coin supérieur droit. Après que Browsersync rechargeait le chrome, rien ne s'est passé. Pour voir les changements, je dois manuellement «shift reload» chrome. J'ai réinitialisé le chrome aux paramètres de base, j'ai trouvé aussi un poste où quelqu'un a dit que je devais désactiver le «cache du navigateur» dans le DevTools sous réseau. Enfin, j'ai ajouté Firefox à la balise du navigateur, et aussi dans Firefox tout va bien.

J'ai un macOS Sierra frais (10.12.6) fonctionnant avec toutes les dernières versions de navigateur.

joint mon gulpfile.js

// VARIABLES 
// ******************************************************** 

var gulp   = require('gulp'), 
    browserSync = require('browser-sync'), 
    del   = require('del'), 
    autoprefixer = require('gulp-autoprefixer'), 
    notify   = require('gulp-notify'), 
    plumber  = require('gulp-plumber'), 
    sass   = require('gulp-sass'), 
    sassGlob  = require('gulp-sass-glob'), 
    sourcemaps  = require('gulp-sourcemaps'), 
    runSequence = require('run-sequence'); 




// Functions 
// ******************************************************** 

// Plumber Function zur Ausgabe von Fehlermeldungen 
function customPlumber(errTitle) { 
    return plumber({ 
    errorHandler: notify.onError({ 
     title: errTitle || "Error running Gulp", 
     message: "Error: <%= error.message %>", 
     sound: "Glass", 
    }) 
    }) 
} 




// Tasks 
// ******************************************************** 



// Sass kompilieren --------- 
gulp.task('sass', function() { 
    return gulp.src('../themes/custom/my-website/sass/**/*.scss') 
    .pipe(customPlumber('Error Running Sass')) 
    .pipe(sourcemaps.init()) 
    .pipe(sassGlob()) 
    .pipe(sass({ 
     includePaths: ['bower_components'], 
    })) 
    .pipe(autoprefixer({ 
     browsers: 'last 2 versions', 
    })) 
    .pipe(sourcemaps.write('./sourcemap')) 
    .pipe(gulp.dest('../themes/custom/my-website/css')) 
    .on('end', browserSync.reload); 
}); 


// Browser Sync (Proxy)------ 
gulp.task('browserSync', function() { 
    browserSync({ 
    proxy: 'dev-my-website.selfip.net', 
    browser: ['google chrome', 'safari', 'firefox'], 
    }); 
}); 


// Clean -------------------- 
gulp.task('clean:dev', function() { 
    del([ 
    'css' 
    ]); 
}); 


// Watch -------------------- 
gulp.task('watch', function() { 
    gulp.watch('../themes/custom/my-website/sass/**/*.scss',['sass']); 
    gulp.watch('../themes/custom/my-website/templates/**/*.twig', browserSync.reload); 
}); 


// Default Task ------------- 
gulp.task('default', function(callback) { 
    runSequence(
    'clean:dev', 
    'sass', 
    ['browserSync', 'watch'], 
    callback 
) 
}); 

Answer 1

Je vois que vous utilisez sourcemaps, de sorte que votre problème pourrait très bien être an SSL certificate issue.