Question

我正在使用Gulp和Browserify建立一个项目，但我在获取watch命令以捕获错误并继续观看时遇到了一些麻烦。

我跑了一大口＆＃39;使用默认任务的命令（下面的代码）。此任务设置使用watch来捕获我的文件中的任何更改，然后使用Browserify编译我的js并编译我的scss文件。

除非我在js中输入语法错误，否则一切顺利。基本上，如果发生这种情况，控制台会显示错误，但不再捕获对我的js文件的更改。

我最初省略了导致整个监视任务失败的错误处理，但现在我已经在那里 - 监视任务仍在继续，它对我的scss工作正常（即使我发出语法错误）但它根本不会对我的js发现任何变化。

var gulp        = require('gulp'),
    gutil       = require('gulp-util'),
    browserify  = require('browserify'),
    changed     = require('gulp-changed'),
    compass     = require('gulp-compass'),
    uglify      = require('gulp-uglify'),
    livereload  = require('gulp-livereload'),
    transform   = require('vinyl-transform'),
    sassSources = ['_src/sass/**/*.scss'],
    jsSources   = ['_src/js/admin.js', '_src/js/main.js'];

var onError = function (err) {
    gutil.log(gutil.colors.green(err));
};

gulp.task('js', function() {

    var browserified = transform(function(filename) {
        var b = browserify(filename);
        return b.bundle();
    });

    return gulp.src(jsSources)
        .pipe(browserified)
        .pipe(uglify())
        .pipe(gulp.dest('assets/js'))

});

gulp.task('js-dev', function() {

    var browserified = transform(function(filename) {
        var b = browserify(filename);
        return b.bundle();
    });

    return gulp.src(jsSources)
        .pipe(browserified)
            .on('error', onError)
        .pipe(gulp.dest('assets/js'))
        .pipe(livereload())

});

gulp.task('sass', function() {

    gulp.src(sassSources)
        .pipe(compass({
            style: 'compressed',
            sass: '_src/sass',
            css: 'assets/css',
            font: 'assets/fonts',
            image: 'assets/images',
            javascript: 'assets/js',
            relative: true,
            require: ['breakpoint']
        }))
        .pipe(gulp.dest('assets/css'))

});

gulp.task('sass-dev', function() {

    gulp.src(sassSources)
        .pipe(changed('assets/css'))
        .pipe(compass({
            style: 'expanded',
            sass: '_src/sass',
            css: 'assets/css',
            font: 'assets/fonts',
            image: 'assets/images',
            javascript: 'assets/js',
            relative: true,
            require: ['breakpoint']
        }))
            .on('error', onError)
        .pipe(gulp.dest('assets/css'))
        .pipe(livereload())

});

gulp.task('watch', function() {
    livereload.listen()
    gulp.watch(jsSources, ['js-dev'])
    gulp.watch(sassSources, ['sass-dev'])
    gulp.watch(['**/*.php']).on('change', function(file) { livereload.changed(file.path) })
})

gulp.task('default', ['watch', 'js-dev', 'sass-dev'])
gulp.task('build', ['js', 'sass'])

上面的代码是我的整个gulpfile，但我测试的任务是默认任务 - 处理js的任务是＆＃39; js-dev＆＃39;任务。

当我的sass-dev任务具有相同的错误处理功能时，为什么我的代码会导致js-dev任务失败？

谢谢！

Answer 1

这是猜测，但错误处理程序可能需要发出一个事件：

var onError = function ( err ) {
  gutil.log( gutil.colors.green( err.message ) );
  this.emit( 'end' );
};

从我自己的gulp.js中偷走，以同样的方式处理浏览器化。

Gulp - 导致任务停止的错误

1 个答案: