博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
项目打包优化
阅读量:7050 次
发布时间:2019-06-28

本文共 396 字,大约阅读时间需要 1 分钟。

  • 问题:项目最初没有使用按需加载,直接引入了echarts和element-ui,打包项目会包含使用不到的模块,chunk包过大,如图:

    clipboard.png

  • 解决方案:引入按需加载插件,babel-plugin-component、babel-plugin-equire,做项目优化
  • 解决步骤:

    1. 查看不包含echarts,element-ui的项目代码,打包大小

      clipboard.png

    2. 查看不做按需加载,只引入echarts的打包大小

      clipboard.png

    3. 配置babel-plugin-equire,在@/lib/echarts.js中添加,需要引入的echarts组件,引入按需加载echarts后的打包大小

      clipboard.png

      clipboard.png

      clipboard.png

      clipboard.png

    4. 查看不做按需加载,只引入element-ui的打包大小

      clipboard.png

    5. 配置babel-plugin-component,按需加载,element-ui后的打包大小

      clipboard.png

    6. 如上,引入按需加载后,echart约缩小了424kb,element-ui约缩小了590kb。

转载地址:http://grpol.baihongyu.com/

你可能感兴趣的文章
用Spring MVC开发简单的Web应用程序
查看>>
hession
查看>>
[CF813E]Army Creation
查看>>
[洛谷P3384]【模板】树链剖分
查看>>
ABP源码分析八:Logger集成
查看>>
oracle:对象(object)操作
查看>>
排序算法之选择排序
查看>>
三门问题
查看>>
ES6之主要知识点(十)Proxy
查看>>
UITableView
查看>>
list详解
查看>>
oracle学习篇六:子查询
查看>>
北风网VIP6级学习视频地址
查看>>
团队小组开发nabc分析
查看>>
jQuery mobile
查看>>
CF893F:Subtree Minimum Query(线段树合并)
查看>>
1305. [CQOI2009]跳舞【最大流+二分】
查看>>
Windows Phone(二) WP7数据库连接(SQLite数据库)
查看>>
浮动与清除问题
查看>>
97. Interleaving String
查看>>