1

我正在使用 gulp concat 和 browserync。当我运行 gulp 时,它会启动 browserync 并连接并重新加载在模块中找到的所有 js 文件。问题是它只连接一次 js 文件,所以我需要停止运行 gulp 并再次运行它,这样我才能看到反映到 js 文件的任何更改。我也只在停止并重新启动 gulp 后才看到 gulp 通知任务。如何设置 gulp 以便始终捆绑和编译 js,然后运行 ​​browersync?

这是我的 gulpfile

var gulp = require('gulp');
var concat = require('gulp-concat');
var browserSync = require('browser-sync').create();
var notify = require('gulp-notify');


// default 
gulp.task('default', ['browserSync', 'scripts'], function (){
// Reloads the browser whenever HTML or JS files change
gulp.watch('app/*.html', browserSync.reload); 
gulp.watch('app/modules/**/*.js', browserSync.reload);
});

gulp.task('scripts', function() {
return gulp.src('app/modules/**/**.js')
  .pipe(concat('main.js'))
  .pipe(gulp.dest('app/build/js'))
  .pipe(notify({ message: 'Scripts in modules have been bundled!' }));
});

//start browsersync
gulp.task('browserSync', function() {
browserSync.init({
server: {
  baseDir: 'app'
},
})
})
4

2 回答 2

1

尝试这个:

// watch 
gulp.task('watch', ['browserSync', 'scripts'], function (){
    // Reloads the browser whenever HTML or JS files change
    gulp.watch('app/*.html', browserSync.reload); 
    gulp.watch('app/modules/**/*.js', ['scripts']);
});

gulp.task('scripts', function() {
   return gulp.src('app/modules/**/**.js')
      .pipe(concat('main.js'))
      .pipe(gulp.dest('app/build/js'))
      .pipe(notify({ message: 'Scripts in modules have been bundled!' }))
      .pipe(browserSync.reload({
          stream: true
      }));
});

gulp.task('default', ['watch', 'scripts']);
于 2016-04-13T17:38:06.983 回答
0

我不确定,但你能试着把

gulp.watch('app/modules/**/*.js', ['scripts']);

在任务“默认”下

据我了解,您的 gulp 没有查看您的文件并运行脚本

PS如果它不起作用,我不是gulp专家,我很抱歉。

于 2016-04-13T17:38:57.147 回答