web-dev-qa-db-ja.com

browserSync.reloadとbrowserSync.stream())-違いは何ですか?

私はこのgulpfile.jsファイルを持っています:

var gulp = require('gulp'),
sass = require('gulp-sass'),
uglify = require('gulp-uglify'),
concat = require('gulp-concat'),
browserSync = require('browser-sync').create();

gulp.task('sass', function() {
    gulp.src('assets/src/sass/*.scss')
    .pipe(sass())
    .pipe(gulp.dest('assets/dist/css'))
    .pipe(browserSync.stream());
});

gulp.task('scripts', function() {
    gulp.src('assets/src/js/*.js')
    .pipe(concat('main.js'))
    .pipe(uglify())
    .pipe(gulp.dest('assets/dist/js'));
}); 

gulp.task('server', ['sass','scripts'], function() {
    browserSync.init({
        proxy: 'http://localhost/example/',
    });
    gulp.watch('assets/src/sass/*.scss', ['sass']);
    gulp.watch('assets/src/js/*.js', ['scripts']);
    gulp.watch('./**/*.php').on('change', browserSync.reload);
});

gulp.task('server', ['run']);

違いは何ですか?

.pipe(browserSync.stream());

そして:

gulp.watch('./**/*.php').on('change', browserSync.reload);

両方必要ですか?彼らは異なる役割を持っていますか?

ありがとう。

9
ronjacob

あなたはおそらく今まであなたの答えを持っていたに違いありませんが、誰かが知る必要がある場合に備えて、ここに答えを残しておきます。

browserSync.reload

ページの更新を行うために使用されます。理想的には、HTMLおよびJSファイルで使用されます。

browserSync.stream

ページを更新せずに変更を挿入するために使用されます。理想的には、これはCSSやその他のスタイルシート形式で使用されます。このコマンドは、スクロール位置をそのまま維持し、通常のページ更新のようにページの先頭に移動しないため、便利です。

16
Yash Ghelani