Gulp browser-sync仅在第一次保存文件时重新加载

时间:2015-07-29 22:21:04

标签: gulp browser-sync

我用

开始
gulp sync

并获取

[17:14:23] Starting 'scripts'...
[17:14:23] Finished 'scripts' after 43 ms
[17:14:23] Starting 'sync'...
[17:14:23] Finished 'sync' after 20 ms
[BS] Access URLs:
 --------------------------------------
       Local: http://localhost:(my port)
    External: http://(my internal IP address)
 --------------------------------------
          UI: http://localhost:(myport+n)
 UI External: http://(my internal IP address)
 --------------------------------------
[BS] Serving files from: public

浏览器加载页面。

我保存了一个文件但是有效。终端输出:

[17:17:22] Starting 'scripts'...
[17:17:22] Finished 'scripts' after 17 ms
[17:17:22] Starting 'scripts-watch'...
[BS] Reloading Browsers...

我再次保存文件(或保存另一个文件)

[17:18:38] Starting 'scripts'...
[17:18:38] Finished 'scripts' after 8.99 ms

注意没有重新加载浏览器消息。浏览器无法重新加载。停止吞咽并手动重新加载页面反映了这一变化。

我的gulpfle:

var gulp = require('gulp'); 
var jshint = require('gulp-jshint');
var less = require('gulp-less');
var concat = require('gulp-concat');
var uglify = require('gulp-uglify');
var rename = require('gulp-rename');
var react = require('gulp-react');
var minifyCSS = require('gulp-minify-css');
var browserSync = require('browser-sync').create();


gulp.task('less', function() {
    return gulp.src('dev/less/*.less')
        .pipe(less())
        .pipe(minifyCSS())
        .pipe(rename('styles.min.css'))
        .pipe(gulp.dest('public/css'))

});

gulp.task('scripts', function() {
    return gulp.src('dev/js/*.js')
        .pipe(rename('scripts.min.js'))
        .pipe(uglify())
        .pipe(gulp.dest('public/js'));
});

gulp.task('build', function() {
    return gulp.src('dev/components/**')
        .pipe(concat('components.min.js'))
        .pipe(react())
        .pipe(uglify())
        .pipe(gulp.dest('public/js'))
});

// Default Task
gulp.task('default', function() {
    gulp.start('less');
    gulp.start('scripts');
    gulp.start('build');
});

gulp.task('scripts-watch', ['scripts'], browserSync.reload);
gulp.task('less-watch', ['less'], browserSync.reload);
gulp.task('build-watch', ['build'], browserSync.reload);

gulp.task('sync', ['scripts'], function() {
    browserSync.init({
        server: {
            baseDir: "public",
            index : "index.htm"
        }
    });

    gulp.watch('dev/js/*.js', ['scripts-watch', browserSync.reload]);
    gulp.watch('dev/less/*.less', ['less-watch', browserSync.reload]);
    gulp.watch('dev/components/**', ['build-watch', browserSync.reload]);
});

如果重要的话,在ubuntu上使用chrome。

0 个答案:

没有答案