/ / Gulp browser-sync no está inyectando estilos - gulp, browser-sync

Gulp browser-sync no está inyectando estilos - gulp, browser-sync

Intento que el navegador sincronice para inyectar estilosusando trago He copiado y pegado bastante del tutorial, pero no ocurre nada. El sass se compila correctamente, pero la inyección no ocurre. ¿Alguna idea de lo que hice mal o cómo depurar esto?

También estoy usando MAMP si hace alguna diferencia.

Mi archivo Gulp:

var gulp = require("gulp"),
sass = require("gulp-sass"),
browserSync = require("browser-sync").create();



// Proxy Server
gulp.task("serve", ["sass"], function() {

browserSync.init({
proxy: "local.website.com"
});

gulp.watch("../css/source/*.scss", ["sass"]);
});


// Compile sass into CSS & auto-inject into browsers
gulp.task("sass", function() {
return gulp.src("../css/source/*.scss")
.pipe(sass().on("error", sass.logError))
.pipe(gulp.dest("../css/build"))
.pipe(browserSync.stream());
});

gulp.task("default", ["serve"]);

La respuesta en mi consola:

[gulp] Starting "default"...
[gulp] Finished "default" after 4.61 μs
[BS] Proxying: http://local.website.com
[BS] Access URLs:
-------------------------------------
Local: http://localhost:3000
External: http://192.168.8.12:3000
-------------------------------------
UI: http://localhost:3001
UI External: http://192.168.8.12:3001
-------------------------------------
[gulp] Starting "sass"...
[BS] 1 file changed (main.css)
[gulp] Finished "sass" after 114 ms
[gulp] Starting "sass"...
[BS] 1 file changed (main.css)
[gulp] Finished "sass" after 115 ms

Si es importante, aquí está mi paquete. Json:

{
"devDependencies": {
"browser-sync": "^2.9.11",
"gulp": "^3.9.0",
"gulp-sass": "^2.0.4"
}
}

Respuestas

1 para la respuesta № 1

El problema en mi caso era Drupal: usa @import en lugar de enlace para agregar archivos CSS. ¡Este módulo lo resuelve! https://www.drupal.org/project/link_css


0 para la respuesta № 2

Usted dice que ha copiado pegado del tutorial, pero no ha copiado esta parte que realmente notifica a browserSync de cambios:

gulp.watch("../css/source/*.scss").on("change", browserSync.reload);