打包上线element浏览器报错因为版本问题

这次打包出现浏览器报错,并且报找不到组件,(问题解决!!!是因为element版本问题,一定注意,版本不一样容易出BUG)
使用CDN主要解决两个问题：

打包时间太长、打包后代码体积太大，请求慢
服务器网络不稳带宽不高，使用cdn可以回避服务器带宽问题

2. 具体步骤

   在/index.html中引入CDN

   1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19

   修改/build/webpack.base.conf.js中修改配置。给module.exports添加externals属性(详见https://webpack.docschina.org/configuration/externals/)，其中键是项目中引用的，值是所引用资源的名字。需要注意的是资源名需要查看所引用的JS源码，查看其中的全局变量是什么，例如element-ui的全局变量就说ELEMENT

   module.exports = {
   context: path.resolve(__dirname, ‘…/’),
   entry: {
   app: ‘./src/main.js’
   },
   externals: {
   ‘vue’: ‘Vue’,
   ‘vue-router’: ‘VueRouter’,
   ‘ElementUI’: ‘ELEMENT’,
   ‘axios’: ‘axios’,
   }
   }
   1
   2
   3
   4
   5
   6
   7
   8
   9
   10
   11
   12

   删除原先的import

   如果不删除原先的import，项目还是会从node_modules中引入资源。
   也就是说不删的话，npm run build时候仍会将引用的资源一起打包，生成文件会大不少。所以我认为还是删了好。

   删了之后我这边又出现另一个问题，ESlint一直在报xxx is not defined的错误，这个是ESlint的配置问题，只需要在使用资源的上部打上备注就行，如下

   /* global Vue */
   Vue.use(VueRouter)

---

作者：Nassir1995
来源：优快云
原文：https://blog.youkuaiyun.com/u014231144/article/details/83791877
版权声明：本文为博主原创文章，转载请附上博文链接！