vue+iview项目webpack打包报错：Unexpected token: punc (() / punc (>)

昨天第一次尝试打包，因为用的是vue-cli，所以直接执行npm run build就可以了。

但是执行完成报错了：

ERROR in 0.866cdedf48bcb07fd685.chunk.js from UglifyJs
Unexpected token: punc (() [0.866cdedf48bcb07fd685.chunk.js:1173,13]

ERROR in 1.866cdedf48bcb07fd685.chunk.js from UglifyJs
Unexpected token: punc (() [1.866cdedf48bcb07fd685.chunk.js:15,13]

网上各种百度之后，找到了大概的原因，就是某些文件没有在Babel转换的范围，所以导致打包的时候报错了。

解决的办法是加上转换范围：

这是原webpack.config文件，

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

修改为：

{
   test: /\.js$/,
   loader: 'babel-loader',
   include: [
     resolve('src')
   ]
}

运行之后还是报了一样的错，看来是有的文件范围还应该更大，接着定位具体是那些文件：

打开报错的代码位置：[0.866cdedf48bcb07fd685.chunk.js:1173,13]

原来是我之前编写的插件上传到npm，在node_modules/ivew-side-menu-search-chg里，因此需要加上这个范围

{
   test: /\.js$/,
   loader: 'babel-loader',
   include: [
     resolve('src'),
     resolve('node_modules/ivew-side-menu-search-chg')
   ]
}

再次build，还是报错了

ERROR in 0.8d3d90670f0e38493a6f.chunk.js from UglifyJs
Unexpected token: operator (>) [0.8d3d90670f0e38493a6f.chunk.js:8582,34]

打开报错的位置：

大概是这一段的代码有问题，通过全局查找部分关键代码等方式，找到了这部分代码是iview的文件：

解决的办法也很简单，加上iview/src路径即可：

{
   test: /\.js$/,
   loader: 'babel-loader',
   include: [
     resolve('src'),
     resolve('node_modules/ivew-side-menu-search-chg'),
     resolve('node_modules/iview/src')
   ]
}

由此可见：使用iview作为UI组件库的情况下，babel转换的时候需要加上iview的路径。貌似element-ui也是如此，在其他文章上看到过；

因此在出现类似js文件打包报错的时候需要根据报错位置去定位大概是那些文件没有包含进去Babel转换的范围。

仅供参考，如有错误还请指出~~