Ant-Design-Vue和Icon按需加载方案 - JeecgBoot实战
本帖最后由 zhangdaiscott 于 2020-7-16 00:10 编辑JeecgBoot实战 - 按需加载方案
一、Ant-Design-Vue 按需加载
1.创建js文件 src/components/lazy_antd.js
2. 修改配置文件 babel.config.js增加插件配置
参考图https://upload-images.jianshu.io/upload_images/13001528-96872e69664c1ab2.png?imageMogr2/auto-orient/strip|imageView2/2/w/843/format/webp
3. 修改main.js 引入配置文件 src/components/lazy_antd.js，同时注释掉原来的 ant-design-vue引入。
src/main.js
https://img2020.cnblogs.com/blog/1223618/202007/1223618-20200715185724485-1783289965.png
4. package.json引入依赖babel-plugin-import
https://img2020.cnblogs.com/blog/1223618/202007/1223618-20200715185802172-732815889.png
参考文献：
https://github.com/vueComponent/ant-design-vue-pro/blob/1.2.0/docs/load-on-demand.md
https://www.antdv.com/docs/vue/getting-started-cn/#按需加载
二、Icon按需加载
1. 创建js文件 src/icons.js
2.修改配置文件 vue.config.js
在 chainWebpack: (config) => { config.resolve.alias 新增一个配置
参考图https://img2020.cnblogs.com/blog/1223618/202007/1223618-20200715185931682-692490158.png备注： 图标如果有缺少，需手工添加。
参考文献: https://github.com/HeskeyBaozi/reduce-antd-icons-bundle-demo
页:
[1]