Скомпилировать gulp sass в задание serve

Question

Я делаю это задание глотка: sass, serve, watch, но я пытаюсь запустить gulp sass, когда часы gulp в службу gulp активируются, но это не работает.

Мне нужно, когда я вношу изменения в файл sass, этот компилятор и показывается в реальном времени в браузере.

Любая помощь?

var gulp = require('gulp'), 
    browserSync = require('browser-sync'), 
    postcss = require('gulp-postcss'), 
    autoprefixer = require('autoprefixer'), 
    sass = require('gulp-sass'); 

gulp.task('serve', function() { 
    browserSync.init({ 
    notify: false, 
    port: 3005, 
    server: { 
     baseDir: ["app"], 
     routes: { 
     '/bower_components': 'bower_components' 
     } 
    } 
    }) 

    gulp.watch(['app/**/*.*']).on('change', browserSync.reload); 
}); 

gulp.task('sass', function() { 

    var processors = [ 
    autoprefixer({ browsers: ['last 2 versions']}) 
    ]; 

    return gulp.src('./app/sass/*.scss') 
    .pipe(sass().on('error',sass.logError)) 
    .pipe(postcss(processors)) 
    .pipe(gulp.dest('./app/css')); 
}); 

gulp.task('watch', ['sass'], function() { 
    gulp.watch('./app/sass/*.scss', ['sass']); 
}); 

gulp.task('default', ['sass']); 

Answer 1

Добавление .pipe(browserSync.reload({stream: true})) к вашей дерзости задачи трубы должны сделать browsersync перезагружать только скомпилированный CSS.

Вот пример вашей глотком задачи

gulp.task('sass', function() { 
    var processors = [ 
     autoprefixer({ browsers: ['last 2 versions']}) 
    ]; 

    return gulp.src('./app/sass/*.scss') 
     .pipe(sass().on('error',sass.logError)) 
     .pipe(postcss(processors)) 
     .pipe(gulp.dest('./app/css')) 
     .pipe(browserSync.reload({stream: true})); 
});