webpack打包vue文件时报错Unexpected token:
master
分支的代码编译打包一直都正常的,今天上午将一个同事的分支合并后就一直编译不过,走读代码发现改动也比较少,也不涉及到package.json
中插件的更新,同时本地编译也完全正常,那阿里云CRP容器
里面怎么会报错呢!最开始报错的地方是在UglifyJs
里面,错误提示是:cannot read property of undefined
,然后是在一个foreach
中抛出来的,接着我就搜索了前端代码里面所有用到foreach
的地方,都没发现语法错误!最后仔细看了一下编译输错,发现有几个warning
,存在版本不匹配的问题,就想着是不是先修复一下这些warning
然后问题就可能会被解决掉呢。
首先去修改UglifyJs
的版本,改到跟本地的一样,单独通过npm install uglifyjs@^2.4.10
安装,结果编译信息提示webpack
版本太低;就再通过npm install webpack@^2.2.0
单独安装webpack
;这时候又提醒我node
版本不合适,一怒之下改成了最新的版本6.10.3
,结果出现graceful-fs
模块不支持的问题:
re-evaluating native module sources is not supported. If you are using the graceful-fs module, please update it to a more recent version.
然后只好将node
版本修改为了5.11.1
,再次编译接着出现了如下的错误:
[INFO] ERROR in bundle-9f062a87cdcafb57be70.js from UglifyJs
[INFO] Unexpected token: operator (>) [bundle-9f062a87cdcafb57be70.js:16836,17]
[INFO] Set has success: 9f062a87cdcafb57be70
解决这个问题的时候也走了一些弯路,自己先去修改了babel
相关插件的版本信息,结果没用,后来看到一哥们说需要单独配置babel
,将配置放到文件.babelrc
中:
{
"presets": ["es2015"]
}
然后就编译通过顺利构建好了镜像,泪奔…..