ブラウザ同期ストリームが機能しない

Question

ブラウザ同期ストリームが動作しません。

例を公式ドキュメントからコピーしましたが、動作しません。 htmlとjsファイルのリロードは正常に動作します。サスストリーミングだけでは機能しません。私はgithubのすべての問題を読んで、私の質問の答えを見つけることができません。

var gulp = require('gulp'); 
var sass = require('gulp-sass'); 
var browserSync = require('browser-sync'); 
var useref = require('gulp-useref'); 
var uglify = require('gulp-uglify'); 
var gulpIf = require('gulp-if'); 
var cssnano = require('gulp-cssnano'); 
var imagemin = require('gulp-imagemin'); 
var cache = require('gulp-cache'); 
var del = require('del'); 
var runSequence = require('run-sequence'); 

// Development Tasks 
// ----------------- 

gulp.task('serve', ['sass'], function() { 

    browserSync.init({ 
     server: { 
      baseDir: "./app", 
      index: 'index.html' 
     } 
    }); 

    gulp.watch('app/styles/*.scss', ['sass']); 
    gulp.watch("app/*.html").on('change', browserSync.reload); 
    gulp.watch('app/pages/*.html').on('change', browserSync.reload); 
    gulp.watch('app/js/**/*.js').on('change', browserSync.reload); 
}); 

// Compile sass into CSS & auto-inject into browsers 
gulp.task('sass', function() { 
    return gulp.src('app/styles/*.scss'). // Gets all files ending with .scss in app/scss and children dirs 
    pipe(sass().on('error', sass.logError)). // Passes it through a gulp-sass, log errors to console 
    pipe(gulp.dest('app/css')). // Outputs it in the css folder 
    pipe(browserSync.stream()); 
}) 

// Build Sequences 
// --------------- 

gulp.task('default', function(callback) { 
    runSequence([ 
     'sass', 'serve' 
    ], callback) 
}) 

gulp.task('build', function(callback) { 
    runSequence('clean:dist', 'sass', [ 
     'useref', 'images', 'fonts' 
    ], callback) 
}) 

Answer 1

私は彼らが助けるかどうかを確認するために3つの簡単な変更を行います。最初

var browserSync = require("browser-sync").create(); 

最後にcreate（）が必要であることに注意してください。あなたのあなたがrenSequenceのものを必要としないので、タスクが最初にとにかく「サス」タスクを呼び出す「仕える」

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

：に

gulp.task('default', function(callback) { 
    runSequence([ 
    'sass', 'serve' 
    ], callback) 
}) 

：第二に、これを簡素化します。最後に、変更：

pipe(browserSync.stream()); 

へ：私もこの変更になるだろう

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

：（ 'アプリ/ JS/**/* JS'）

gulp.watch('app/js/**/*.js').on('change', browserSync.reload(stream:true}));