如何实战优化VUE项目中ElementUI和定制首页内容？

本文共计1175个文字，预计阅读时间需要5分钟。

接上篇《63、指定打包入口及加载外部CDN资源》+ 上一篇介绍了为开发模式与发布模式制定不同的打包入口，接着为项目加载外部CDN资源。本章我们来学习通过CDN优化ElementUI的打包。

接上篇《​​63、指定打包入口及加载外部CDN资源​​》 上一篇我们为开发模式与发布模式制定不同的打包入口，然后为项目加载外部CDN资源。本篇我们来学习通过CND优化ElementUI的打包，以及完成根据生产和测试环境进行不同定制不同的首页内容。

一、通过CDN优化ElementUI的打包

经过上一篇的折腾，我们可以发现项目的体积确实小了不少，但是观察vueUI面板的资源信息，可以看到还是有一个感叹号：

说明当前的文件体积还是有点大，那么如何把它优化的更小呢？

我们可以注意到上图右侧依赖项里，占据绝大多数体积的还是ElementUI依赖，所以我们还是需要把ElementUI从“chunk-vendors.5bd4ca24.js”中抽出去，即为ElementUI依赖设置cdn加载。