vue中引入echarts导致打包后的文件过大的问题

东明兄 • 2018-09-13 • 开发笔记 • 7505 阅读
chat

在vue找那个引入echarts图表，打包后的js达到了2M，加载速度很慢，，将echarts改成cdn的方式就可以了，

1.在index.html 添加    <script src="//cdn.bootcss.com/echarts/4.1.0.rc2/echarts.common.min.js"></script>


2.在webpack中配置echarts
    在webpack.base.conf.js文件内添加external选项，在module.exports内部，和entry平级；
externals: {
   "echarts": "echarts"
 }, 
        externals中的key是给import的时候用的，value表示的是如何在global中访问到该对象，这里是window.echarts

3.在vue文件中使用

        在vue中使用echarts的时候不再需要import echarts了，可以直接使用就好，初始化图表由this.$echarts.init改为echarts.init

版权声明：
作者：东明兄
链接：https://blog.crazyming.com/note/593/
来源：CrazyMing
文章版权归作者所有，未经允许请勿转载。

THE END
分享
二维码
海报
vue中引入echarts导致打包后的文件过大的问题
不导入echarts 使用cdn的方式引入
<<上一篇
下一篇>>
chat