浏览器同步 (GULP) 在修改 SASS 后不会刷新页面

Question

>我使用 sass 和浏览器同步构建应用程序。我使用 jhipster 生成了配置。

当我修改我的 *.scss 文件时，页面不会自动刷新。这是我的gulpfile的一部分.js：

gulp.task('sass', function () {
    return gulp.src(config.scss + '**/*.{scss,sass}')
        .pipe(plumber({errorHandler: handleErrors}))
        .pipe(changed(config.app + 'assets/styles', {extension: '.css'}))
        .pipe(sass({includePaths:config.importPath}).on('error', sass.logError))
        .pipe(gulp.dest(config.app + 'assets/styles'));
});
gulp.task('styles', ['sass'], function() {
    return gulp.src(config.app + 'assest/styles')
        .pipe(browserSync.reload({stream: true}));
});

文件也是由jhipster生成的。我已经尝试了在堆栈溢出上找到的所有解决方案，但没有任何效果。代码有问题吗？

如果有必要，我可以发布整个文件。

Answer 1

尝试：

gulp.task('sass', function () {
return gulp.src(config.scss + '**/*.{scss,sass}')
    .pipe(plumber({errorHandler: handleErrors}))
    .pipe(changed(config.app + 'assets/styles', {extension: '.css'}))
    .pipe(sass({includePaths:config.importPath}).on('error', sass.logError))
    .pipe(gulp.dest(config.app + 'assets/styles'));
    .pipe(browserSync.reload({stream: true}));
});

并运行任务sass

Answer 2

JHipster 2.27.2 版本修复了 sass 和浏览器同步的一些问题。尝试更新 JHipster 并重新生成您的项目。