gulp构建项目（附录一）：gulp发生错误时，进程挂掉的问题

版权声明：原创文章，引用请注明出处！ https://blog.csdn.net/guang_s/article/details/84795548

一、编译less发生错误后，监听失效

1、编写css代码时，因为有自动保存，可能一行样式还没写全，文件就保存了，这样的话 less() 编译会报错，如下：

2、我们发现进程虽然没有挂掉，但是再修改css文件时，watch监听就失效了。这是因为 less() 编译导致的。解决方案如下：

手动加入错误提示

gulp.task('css_main', function(){
    return gulp.src('./src/css/**/*.css')
        .pipe(less())           // 编译less
        .on('error', function(err) {    // 解决编译出错，监听被阻断的问题
            console.log('Less Error!', err.message);
            this.end();
        })
		.pipe(autoprefixer({
            browsers: ['last 2 versions'],
            cascade: false      // 是否美化
        }))
        .pipe(concat('main.min.css'))
        .pipe(gulpif(env==='build', csso()))    // 判断是否压缩css
        .pipe(gulp.dest('./dist/css'));
});

3、less() 编译加入错误提示之后的效果

我们看到了Less Error ！，但是监听没有被阻断

二、修改js代码发生错误时，进程被阻断

修改js代码发生错误时，进程被阻断

注：前面的文章介绍过，在开发环境下是不需要压缩js的，并且我们在压缩之前有 uglify_check 任务来检查js语法，所以也就不存在这个问题。

.

项目地址（别忘了给星哦）

https://github.com/shiguang0116/gulp-project

相关文章

gulp构建项目（一）：环境准备及项目基础结构搭建
gulp构建项目（二）：browser-sync启本地服务并开启浏览器
gulp构建项目（三）：gulp-watch监听文件改变、新增、删除
gulp构建项目（四）：run-sequence实现逐个执行任务
gulp构建项目（五）：gulp-if条件判断及环境变量设置
gulp构建项目（六）：gulp-html-tpl处理公用模板
gulp构建项目（七）：gulp-uglify压缩js以及检查js语法错误
gulp构建项目（八）：gulp编译less，添加CSS前缀以及压缩css
gulp构建项目（九）：gulp-imagemin压缩图片及gulp-cache缓存
gulp构建项目（十）：gulp-rev-collector-dxb添加版本号（?hash）
gulp构建项目（十一）：gulp-htmlmin压缩html
gulp构建项目（十二）：gulp-babel编译es6
gulp构建项目（十三）：babel-polyfill编译es6新增api
gulp构建项目（十四）：gulp-rename重定义打包生成文件的路径
.
gulp构建项目（附录一）：gulp发生错误时，进程挂掉的问题
gulp构建项目（附录二）：run-sequence逐个执行任务不生效的问题