需求分析：将js文件压缩成一行，减少js文件的大小。压缩过程中如果遇到js语法错误，将会报错并且压缩会被终止。所以我们需要：
- 在开发环境下，编写js代码时，要监听并检查js文件的语法，避免语法错误导致最后生产环境打包压缩js时失败的问题
- 在生产环境时，压缩js时保证没有语法错误，或者说提供检查语法错误的task，以方便检查错误
一、安装gulp-uglify和pump模块
说明：使用pump代替pipe可以检查到js的语法错误
npm i -D gulp-uglify pump
二、gulp-uglify使用
如下，这样使用的话就没办法检查到js中的语法错误，会导致最后打包失败的问题，所以要引入pump模块来帮助我们查出哪里的语法有错，方便修改
var uglify = require('gulp-uglify'); // js 压缩
gulp.task('js_main', function(){
return gulp.src('./src/js/*.js')
.pipe(concat('main.min.js')) // 合并文件并命名
.pipe(gulpif(env==='build', uglify())) // 压缩js
.pipe(gulp.dest('./dist/js'));
});
三、使用pump代替pipe
var uglify = require('gulp-uglify'); // js 压缩
var pump = require('pump');
gulp.task('js_main', function (cb) {
pump([
gulp.src('./src/js/*.js'),
concat('main.min.js')
uglify(),
gulp.dest('./dist/js')
], cb);
});
如上可以实现我们的需求。但是会出现新的问题：
1、只有执行压缩命令，才会检查到错误，而开发模式是不需要压缩的；
2、必须要等到concat()之后再执行uglify()，否则压缩过后的文件可能会有很多重复代码，比如：会有多个’use strict’，导致压缩不彻底；
3、因为concat()要先执行，所以控制台对于js语法的报错提示是基于main.min.js的，如下，这并不能协助我们进行代码修改。
4、我们有时候需要单独检查js语法，而不需要做任何其他的操作，所以要将检查js语法的任务独立出来，请看下一步骤：
.
四、创建uglify_check任务
1、此任务不需要合并文件，不需要打包到dist/；
2、此任务作为’js_main’的依赖执行，如果有错，则’js_main’不会被执行
gulp.task('uglify_check', function (cb) {
pump([
gulp.src('./src/js/*.js'),
uglify(),
], cb);
});
gulp.task('js_main', ['uglify_check'], function(){
return gulp.src('./src/js/*.js')
.pipe(concat('main.min.js')) // 合并文件并命名
.pipe(gulpif(env==='build', uglify())) // 判断是否压缩压缩js
.pipe(gulp.dest('./dist/js'));
});
3、开发过程中，编写js文件时的错误提示，如下，可以直接点击链接调到错误的代码的地方，方便进行修改
五、gulp uglify_check使用
1、如上，我们在开发过程中能够很好的避免语法错误。
2、退一步讲，如果开发时有些错误没有及时更改过来并且又被浏览器兼容了。那我们在npm run build失败的时候可以通过gulp uglify_check单独检查错误并修改。比如：Chrome浏览器会兼容es6的语法，但是uglify()是不能压缩es6的
3、后续会讲到使用gulp-babel编译es6
.
项目地址（别忘了给星哦）
相关文章
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