Gulp 错误管理

Gulp 错误管理

Gulp 目前的错误处理方式，一旦发生错误进程就挂了，得手动去重启。虽然开发者预期在​​gulp 4 中解决此问题​​​，但 gulp 4 什么时候发布并没有明确时间表，在此之前，还是很有必要了解一下更优雅的错误处理方式，除非你钟情于反复在命令行里输入 ​​gulp​​ 然后回车。

使用 Stream 事件 API 处理错误

Stream 发生错误时，会触发 ​​error​​​ 事件，监听 ​​error​​ 事件进行错误处理可以避免 gulp 进程崩溃。

基本错误处理

下面的例子中，添加了 Less 编译的错误处理，Less 发生编译错误时，会在命令行输出错误信息，gulp 进程不会挂掉，修正错误后，watch 任务将继续执行。

注意：使用 gulp-util 只是使错误日志格式与 gulp 的日志保持一致，如果不想多一个依赖，可以直接使用 ​​console​​。

var gulp = require('gulp'); var less = require('gulp-less'); var csso = require('gulp-csso'); var gutil = require('gulp-util');gulp.task('less', function() { return gulp.src('less/app.less') .pipe(less()) .on('error', function(err) { gutil.log('Less Error!', err.message); this.end(); }) .pipe(csso()) .pipe(gulp.dest('./dist'))});gulp.task('watch', function() { gulp.watch('less/**/*.less', ['less']);});

gulp.watch 与 Browserify 中的错误处理

Browserify 中的常规流与 gulp 中的 vinyl 对象流有点不同，browserify 的错误处理中需要手动触发 ​​end​​​，以停止流在管道中传送。如果不添加 ​​this.emit('end');​​，进程仍然会挂掉。

var gulp = require('gulp'); var browserify = require('browserify'); var source = require("vinyl-source-stream");gulp.task('browserify', function(){ return browserify('./main.js').bundle() .on('error', function(err){ console.log(err.message); this.emit('end'); }) .pipe(source('main.out.js')) .pipe(gulp.dest('./dist'));});

使用插件

使用 Stream 的事件 API 虽然可以处理错误，但是在每个插件后面都需要添加错误监听函数，有点恶心，还好有专门的插件处理这个问题。

gulp-plumber

​​gulp-plumber​​ 可以阻止 gulp 插件发生错误导致进程退出并输出错误日志。

var gulp = require('gulp'); var less = require('gulp-less'); var csso = require('gulp-csso'); var plumber = require('gulp-plumber');gulp.task('less', function() { return gulp.src('less/app.less') .pipe(plumber()) .pipe(less()) .pipe(csso()) .pipe(gulp.dest('./dist'))});

这比添加错误监听事件省事多了。

stream-combiner2

​​stream-combiner2​​ 把多个 stream 合并为一个，也就是说只需要添加一个错误监听，相比之下，还是 gulp-plumber 方便。

var combiner = require('stream-combiner2'); var uglify = require('gulp-uglify'); var gulp = require('gulp');gulp.task('test', function() { var combined = combiner.obj([ gulp.src('bootstrap/js/*.js'), uglify(), gulp.dest('public/bootstrap') ]); // any errors in the above streams will get caught // by this listener, instead of being thrown: combined.on('error', console.error.bind(console)); return

参考链接

​​Error management in gulp​​​​Combining streams to handle errors​​​​Prevent errors from breaking / crashing gulp watch​​​​Error Handling while using gulp.watch​​

版权声明：本文内容由网络用户投稿，版权归原作者所有，本站不拥有其著作权，亦不承担相应法律责任。如果您发现本站中有涉嫌抄袭或描述失实的内容，请联系我们jiasou666@gmail.com 处理，核实后本网站将在24小时内删除侵权内容。