truco: cómo actualizar el navegador sin actualizar (solo para cambios de CSS)

He configurado gulps de manera que el navegador se vuelve a cargar cuando hago cambios. Sin embargo, para los cambios de css quiero que el navegador se actualice sin actualizar, pero no estoy seguro de cómo hacerlo. Para mi configuración actual he usado este tutorial:

var debug = require('gulp-debug'), connect = require('gulp-connect'), watch = require('gulp-watch'), livereload = require('gulp-livereload'); gulp.task('webserver', function () { connect.server({ livereload: true, root: ['demo/'] }); }); gulp.task('livereload', function () { gulp.src(['index.html', 'resources/**/*.js']) .pipe(watch(['resources/**/*.html', 'index.html'])) //.pipe(debug({verbose: true})) .pipe(connect.reload()); }); gulp.task('watch', function () { livereload.listen(); gulp.watch('resources/**/*.scss', ['css']); }); 

En mi tarea css tambien llamo

 .pipe(livereload()); 

¿Alguna sugerencia de lo que necesito modificar para que las actualizaciones de css ocurran sin una actualización?

ACTUALIZACIÓN: Aquí está mi tarea css (un poco simplificado):

 gulp.task('css', function () { ... return gulp.src('demo.scss') .pipe($.sass({ errLogToConsole: true })) .pipe(gulp.dest('./target/') .pipe(livereload()); }); 

livereload.changed(files) llamar a livereload.changed(files) cuando ocurre un cambio. Para hacer eso, ver el documento de Gulp-Watch .

 watch('**/*.js', function (files) { livereload.changed(files) }); 

Es posible que necesite una extensión de cromo para gulp-livereload

Tuve el mismo problema contigo, lo resolví.

Descubrí que es descontrolado usar el soporte de carga de hígado incorporado en gulp-connect.

Por lo tanto, traté de hacer que livereload funcione de forma independiente.

Simplemente configure su configuración gulp-connect sin livereload y llame a livereload.listen con la opción de host especificada (en la mayoría de los casos debería ser ‘localhost’). Me gusta

 livereload.listen({ host: 'localhost' }); 

Y luego mira los archivos que quieras detectar. Me gusta

 var changedFile = null; gulp.task("livereload", function(cb){ return gulp.src(changedFile) .pipe(plumber()) .pipe(livereload()); }); gulp.watch(['*.css']).on('change', function(file) { changedFile = file.path; // run specific task according to the given file's extension // gulp.start(['livereload']); });