ERROR in build.js from UglifyJs Unexpected token operator «=», expected punc «,»

最近在做vue项目,用的 webpack-simple 模板。开发过程中都没有问题。当打包上线的时候出现问题了。也就是运行

npm run build //这个大家都知道是上线时打包用的,会把代码压缩。
复制代码

提示了如下错误

ERROR in build.js from UglifyJs
Unexpected token operator «=», expected punc «,» [./node_modules/quill-image-extend-module/index.js:12,0][build.js:76527,35]
复制代码

从网上找了一大圈都没有能解决掉(伤心),有说配置babel的presets。我这个用的是模板默认配置肯定是没有问题的(pass)。也有说是webpack压缩器new webpack.optimize.UglifyJsPlugin的问题,让从新安装uglifyjs-webpack-plugin,经过尝试也没有能解决掉问题。
不过也不是没有任何收获,经过反复百度发现,其实最终的问题是es6的问题,weback默认的webpack.optimize.UglifyJsPlugin不能压缩es6的代码文件。顺着这个思路只要我们把es6的代码用babel转换成es5即可。
可是我用的是默认的模板,babel都是配置好的,问题出在了哪里呢。原因肯定还是在webpack.config.js上。经过反复观测发现。问题出现在了loader配置上,loader上有一项是配置js文件转换的。

 {
        test: /\.js$/,
        loader: 'babel-loader',
        exclude: /node_modules/,
      
      }
复制代码

上面的配置exclude: /node_modules/。这一项排除了/node_modules,也就说是这项配置在用loader转化es5的时候不对node_modules下的引用进行es5转换。
看上面的报错信息,我项目中引用了/node_modules/quill-image-extend-module/index.js。根据exclude: /node_modules/,这个配置打包的时候是不会对这个文件进行es5转码。而webpack.optimize.UglifyJsPlugin不能压缩es6语法的文件,所以就报错了。
知道问题所在,那么就好解决了。代码如下

 {
        test: /\.js$/,
        loader: 'babel-loader',
        //exclude: /node_modules/,    //只要把这个注释掉就可以了。就会先进行es5转换,然后在打包压缩
      
      }
复制代码

再次运行 npm run build 不在报错。正常编译成功了。
我们在项目开发中会经常引用第三方插件,所以我觉得这项配置可以直接去掉。避免麻烦发生。

转载于:https://juejin.im/post/5bc5a4cb5188255c90320002

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值