gulp - 导致任务停止的错误

Gulp - Error Causing Task to Stop

本文关键字:错误 任务 gulp      更新时间:2023-09-26

我正在使用 Gulp 和 Browserify 设置一个项目,但我在让 watch 命令捕获错误并继续观看时遇到了一些麻烦。

我使用默认任务运行"gulp"命令(下面的代码(。此任务使用监视设置以捕获我文件中的任何更改,然后使用 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的任务是"js-dev"任务。

为什么我的代码会导致 js-dev 任务失败,而具有相同错误处理的 sass-dev 任务却没有?

谢谢!

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

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

从我自己的gulp.js中窃取的,它以相同的方式处理浏览器化。