gulp+browser-sync 不会自动刷新我的本地项目,求教。

1.最近尝试着再用gulp配置管理项目资源,感觉非常强大。可是发现gulp+browser-sync自己用不好,百度了很多,尝试了一些办法,均不好使,请教下各位大神。。为什么 不会自动刷新我的本地项目,本地端口8080
2.代码如下:

gulp.task('serve',['less'], function() {
    browserSync({
        //指定服务器启动根目录
        // server: "dist",
        open: "local",
        directory: true,
        browser: "chrome",
        proxy: "localhost:8080"
    });
    //监听es6编译
    gulp.watch(es6Src, function (event) {
        runSequence(
            ['toes5'],
            ['jshint'],
            ['uglify'],
            ['revJs'],
            ['revHtml'],
            ['reload']
        )
    });

均能执行完,运行结果如下

clipboard.png
甚是捉急,请大神指点一二,在线等。。。

阅读 3.3k
1 个回答

你的task任务serve屁股后面少了东西:

});

watch要放到serve这个task里面才行
顺便[less]对应的task你没给出,结尾是否注入刷新状态?:

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

给你个最简单清楚的配置- -我这里以监听刷新sass为例

var gulp = require('gulp'),
    sass = require('gulp-sass'),
    browserSync = require('browser-sync');
gulp.task('sass',function(){
  gulp.src('dev/scss/**/*.scss')
  .pipe(sass())
  .pipe(dest('dev/css'))
//此处是————————————————————————————————————写法A(A/B二选一)
.pipe(browserSync.stream());
//此处是————————————————————————————————————写法B(A/B二选一)
.pipe(browserSync.reload({stream:true});
}
gulp.task('serve',['sass'],function(){
//指定服务器启动目录
  browserSync.init({server:'dev'});

//监听SCSS文件改变
gulp.watch('dev/scss/**/*.scss',['sass']);
});

写法A和B的区别
写法A:sass源文件dev/scss//.scss变化时,整个页面刷新。*
写法B:sass源文件dev/scss//.scss变化时,只有局部刷新。*

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题