javascript - habilitar - Mira el nuevo archivo en un trago y un problema con la sincronización de navegadores

habilitar javascript en chrome en windows

Question

Estoy usando browsersync para volver a cargar el navegador cuando el archivo ha cambiado. y es un trabajo perfecto. ¡Pero cuando creo un archivo nuevo como html - scss - js bowsersync no funcionan! ¿Cómo arreglar este problema?

gulpjs:

// Browser Sync
gulp.task(''browser-sync'', function() {
browserSync({
injectChanges: true,
notify: false,
server: "app"
});
});
gulp.task(''default'',[''sass'',''scripts'', ''browser-sync''], function(){
gulp.watch("app/**/*.html").on(''change'', reload);
gulp.watch(''app/img/*.*'', [''bs-reload'',''images'']);
gulp.watch(''src/scss/**/*.scss'', [''sass'']);
gulp.watch(''src/js/**/*.js'', [''scripts'',''uglify'']);
});

Answer 1

Resulta que la solución es bastante simple. No use gulp.watch. Use browserSync.watch en su lugar. También voy a reorganizar tu tarea y agregar una configuración. Ayuda en esta instancia:

gulpfile.js

// ------------------------------------------------------ Config
var config = {
bs: {
opts: {
injectChanges: true,
notify: false,
server: "app"
},
watch: [
''app/**/*.html'',
''app/img/*.*'',
''src/js/**/*.js''
]
}
}
// ------------------------------------------------ Browser Sync
gulp.task(''browser-sync'', function() {
browserSync.init( config.bs.opts );
browserSync.watch( ''./src/scss/**/*.{scss,sass}'', [ ''sass'' ] );
browserSync.watch( ''src/js/**/*.js'', [ ''scripts'', ''uglify'' ] );
browserSync.watch( ''app/img/*.*'', [ ''images'' ] );
browserSync.watch( config.bs.watch ).on(''change'', reload);
});
// ----------------------------------------------------- Default
gulp.task( ''default'', [ ''sass'',''scripts'', ''browser-sync'' ] );

Eso debería funcionar. Espero que ayude.