当我更改一些 scss 文件时,一切似乎都能正常工作(scss 被编译为 css 文件并查看源文件):
[21:19:46] Starting 'sass'...
[BS] 1 file changed (principal.css)
[21:19:46] Finished 'sass' after 18 ms
但我需要手动重新加载浏览器以反射(reflect)更改。这是我的 gulpfile:
var gulp = require('gulp');
var browserSync = require('browser-sync').create();
var sass = require('gulp-sass');
// Static Server + watching scss/html files
gulp.task('default', ['sass'], function() {
browserSync.init({
proxy: "huertajalon/"
});
gulp.watch("./sass/**/*.scss", ['sass']);
gulp.watch("./*.php").on('change', browserSync.reload);
gulp.watch("./style.css").on('change', browserSync.reload);
});
// Compile sass into CSS & auto-inject into browsers
gulp.task('sass', function() {
return gulp.src("sass/principal.scss")
.pipe(sass())
.pipe(gulp.dest("./css"))
.pipe(browserSync.stream());
});
在其他情况下(例如,当我修改并保存 style.css 时)浏览器会重新加载。
我做错了什么?谢谢!
最佳答案
您是否使用浏览器同步版本 2.6.0 或更高版本,因为这是使用 browserSync.stream()
所必需的。
http://www.browsersync.io/docs/api/#api-stream
如果不是,那么您应该更新,或者您可以尝试使用 browserSync.reload({stream: true})
,这是以前使用浏览器同步处理流的方法。如果我没记错的话。
关于Gulp-sass 和浏览器同步不重新加载浏览器,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32017406/