解决webpack打包错误：Unexpected token: name (raf)

痛定思痛。 2022-01-14 12:57 799阅读 0赞

在使用webpack模板的vue-cli项目时，打包的时候会报错，错误内容如下：

ERROR in main.b05fb3748db2b4de34df.js from UglifyJs
Unexpected token: name (raf) [main.b05fb3748db2b4de34df.js:44619,4]
Child html-webpack-plugin for “..\index.html”:
1 asset
npm ERR! code ELIFECYCLE
npm ERR! errno 2
npm ERR! iview-admin@ build: `webpack —progress —hide-modules —config build/webpack.prod.config.js`
npm ERR! Exit status 2
npm ERR!
npm ERR! Failed at the iview-admin@ build script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\82506\AppData\Roaming\npm-cache\_logs\2019-06-06T12_30_59_948Z-debug.log

通过错误信息大概可以了解到，报错来自 UglifyJs 这个插件引起的，出现上面的问题，首先会想到的webpack的压缩代码插件出问题了，项目中使用uglifyjs-webpack-plugin来压缩代码。

原来，uglify-js在压缩代码时，遇到es6语法就不会压缩并且也会报错。

后来通过跟换JS压缩插件解决了问题

使用插件：BabiliPlugin

安装插件

  1. npm i babili-webpack-plugin

在webpack生产环境配置文件中使用

  1. //webpack.prod.js
  3. const BabiliPlugin=require("babili-webpack-plugin");
  6. .
  7. .
  8. .
  9.  new BabiliPlugin(),

watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQxNzI1NDUw_size_16_color_FFFFFF_t_70

发表评论

表情：
评论列表 （有 0 条评论，799人围观）

还没有评论，来说两句吧...

相关阅读