Gulp-sass 和浏览器同步不重新加载浏览器

标签 gulp browser-sync gulp-sass

当我更改一些 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/

相关文章:

javascript - 为什么浏览器与 gulp 同步不起作用

Cordova 9 : browser-sync alternatives

gulp +浏览器同步无法获取/错误

javascript - 编译额外文件时出现奇怪的 gulp-sass 问题

javascript - 使用 gulp concat for css 我如何将 main.css 连接到我所有其他的 css

node.js - gulp.dest 挂起复制 Electron 构建应用程序(macoS)

node.js - 引用错误: sass is not defined

MSBuild LibSass 错误

node.js - Gulp 没有将 scss 转换为 css

javascript - 应用程序 : Creating separate files for angularjs controllers, 服务等的基础