gulp 中对于css文件的压缩合并出现的unable to minify JavaScript问题

在咱们平常使用gulp进行js文件压缩合并的时候：

const gulp = require('gulp');
const concat = require('gulp-concat');
const rename = require('gulp-rename');
const uglify = require('gulp-uglify');

 

gulp.task('copy-js',() => {

    gulp.src('./js/**/*')

        .pipe(concat('main.js'))

        .pipe(gulp.dest('dist/js'))

        .pipe(uglify())

        .pipe(rename('main.min.js'))

        .pipe(gulp.dest('dist/js'))

        .pipe(connect.reload())

})

在以上代码进行的时候，有时候会报出这样的错误：

 

 这里的话咱们复制

GulpUglifyError: unable to minify JavaScript这个错误去查询的话通常只是给咱们的搜索的回答都是报的错误是js代码错误:报了该错误主要是由于javascirpt语法问题， 此时你要每一个文件去看是不可能;错误二可能它的错误实际上是：在es5环境里使用了es六、es7语法；

解决第一个问题的方法就是：安装 gulp-util 模块 用于打印日志：

npm install --save-dev gulp-util

gulp.task('copy-js', function() {
        gulp.src(['/**/*.js', 'public/lib/**/*.js'])
            .pipe(uglify())
            .on('error', function(err) {
                gutil.log(gutil.colors.red('[Error]'), err.toString());
            })
            .pipe('dist/js')
    })

而后就能够获得打印报错内容：

ADMINs-Mac-pro:frontend admin$ gulp script
[11:45:54] Using gulpfile ~/workspace/frontend/gulpfile.js
[11:45:54] Starting 'script'...
[11:45:54] Finished 'script' after 14 ms
[11:45:55] [Error] GulpUglifyError: unable to minify JavaScript
Caused by: SyntaxError: Unexpected token: punc (,)
File: /Users/admin/workspace/frontend/public/js/basic.js
Line: 247

就能够去排除错误了；

其实若是对于本身的代码有信心以为并非本身写错了的话，其实就是第二种错误了，就是在gulp中它支持的是es5的语法的，而随着时代的发展，咱们程序猿的更新迭代也是迅速的，渐渐的es6和se7都开始频繁的使用起来了，因此gulp的报错也是正常的，那么咱们就要安装一些gulp的模块来帮助咱们将咱们的es6和es7的语法转换成适合gulp的es5的语法；gulp-babel 、babel-preset-es2015：

npm install babel-core gulp-babel@7 babel-preset-es2015 -D

在gulp命令框中输出进这行代码，能够将咱们书写的es6语法转换成gulp的可以解读的es5的语法；

在这里咱们要建立一个文件：

 

 

 而后在文件中写这一段代码：

 

 

 但其实这个方法只能对es6的语法转换成es5语法；

可是咱们还有别的方法能够实现es5以上的语法转换成es5的语法的模块：

那就是将es2015改为env：

 

babel-preset-env es5以上的js语法均可以处理

cnpm i babel-core gulp-babel@7 babel-preset-env -D

相应的咱们也要将.babelrc中的es2015改为env：

 

 而后再去打包压缩咱们的js的代码就不会出现这个报错了；

OK，此次就分享这么一个小报错了，各位看官下次再见，托尔接着码去嘹。