當SASS更新時，瀏覽器同步無法使用吞噬

Question

我有一個瀏覽器同步運行和js/sass編譯的gulp文件。它爲我的Angular SPA服務。它看起來像這樣：

gulp.task('default', function(){ 
    return runSequence(['build-css', 'build-js'], 'serve-dev'); 
}); 

gulp.task('serve-dev', function() { 

    browserSync.init(null, { 
    server: { 
     baseDir: './', 
     middleware: [ 
     modRewrite([ 
      '!\\.\\w+$ /index.html [L]' 
     ]) 
     ] 
    } 
    }); 

    gulp.watch(paths.js.dir + '/**/*.js', ['watch-js']); 
    gulp.watch(paths.css.dir + '/**/*.scss', ['watch-css']); 
    gulp.watch(paths.html.dir + '/**/*.html').on('change', browserSync.reload); 

}); 

gulp.task('watch-css', ['build-css'], browserSync.reload); 
gulp.task('watch-js', ['build-js'], browserSync.reload); 

gulp.task('build-css', function() { 
    return gulp.src(paths.css.src) 
    .pipe(sourcemaps.init()) 
    .pipe(sass().on('error', sass.logError)) 
    .pipe(autoprefixer({ 
     browsers: ['> 0.5%'] 
    })) 
    .pipe(cleanCSS()) 
    .pipe(rename('app.min.css')) 
    .pipe(sourcemaps.write('./')) 
    .pipe(gulp.dest(paths.css.dest)); 
}); 

gulp.task('build-js', function() { 
    return gulp.src(paths.js.src) 
    .pipe(sourcemaps.init()) 
    .pipe(concat('app.min.js')) 
    .pipe(ngAnnotate()) 
    .pipe(uglify()) 
    .pipe(sourcemaps.write('./')) 
    .pipe(gulp.dest(paths.js.dest)); 
}); 

它的工作原理最初以服務的網站，當我更新的HTML文件都會刷新，但是當我更新SASS文件，它不會刷新。所有的路徑都是正確的，因爲初始編譯工作正常。

Answer 1

添加

.pipe（browserSync.stream（））

在 '集結CSS' 任務的結束。它爲我工作