gulp-babel没有将ES6转为ES5,
使用gulp-babel转换ES6到ES5,然后用uglify对代码压缩,gulpfile中的代码片段:
gulp
看到下面的报错
GulpUglifyError: unable to minify JavaScript
SyntaxError: Unexpected token: keyword «const»
或
SyntaxError: Unexpected token: punc «(»
这个报错是因为uglify不支持ES6语法,但是我上面的gulp任务中是先用babel对ES6语法转换之后再uglify,说明babel没有正常工作。打开dist文件夹查看生成的文件中的代码,确实ES6语法没有被转成ES5。奇怪的是项目之前一直正常。感觉是某个相关的node模块版本升级后导致的,我的项目之前是在根目录下放了一个.babelrc文件,里面的内容是:
{ "presets": [ [ "@babel/preset-env", { "targets": "> 0.5%, not dead" } ] ], "comments": false, "ignore": [] }
之前的解决方法就是把package.json和package-lock.json都换成之前正常的版本,并删除node_modules,然后重新npm install。
研究了很久,发现问题应该还是出在presets没有生效上,最后按gulp-balel官方说明文档的例子解决:
gulp.task('default', () => gulp.src('src/app.js') .pipe(babel({ presets: ['@babel/env'] })) .pipe(gulp.dest('dist')) );
也就是在gulpfile.js中的babel方法的参数中直接指定presets。
喜欢的话,请点赞,转发、收藏、评论,谢谢!