使用 gulp-browser-sync 重新加载而不传递任何参数

Question

我正在为我的项目编写我的gulp文件。代码如下：

gulp.task('sass', function() {
    gulp.src(paths.styles.src)
        .pipe(sass({
            outputStyle: 'compact',
            includePaths: [paths.styles.src]
        }))
        .pipe(autoprefix())
        .pipe(gulp.dest(paths.styles.dest))
        .pipe(browserSync.reload());
});

我正在尝试做的是，如果*.scss文件有任何更改，请重新加载浏览器。（我的paths.styles.src是'dev/assets/scss/**/*.scss'）

但是最后一个管道不起作用。它仅在我放置一些配置时有效，例如：

.pipe(browserSync.reload({
    stream: true
}));

谁能为我解释一下，因为网上的文件不够清楚。

多谢。

Answer 1

我以这种方式使用浏览器同步重新加载： gulp.watch（， ['styles']）; gulp.watch（， function（） { browsersync.reload（）; });通过这种方式，您可以监视 scss 编译中的更改，并监视输出 CSS 文件的输出和重新加载更改。以您的方式，每次编译后都会重新加载，这也有效。但是您需要一个监视方法来更改 scss 文件。如果你想在编译后在管道中使用它，你必须把它作为

reload({stream: true})

这样，您就不会重新加载整个文档。浏览器同步仅将新 CSS 注入浏览器。