Ant Design of Vue 一句代码实现自动按需引入图标

已于 2023-08-08 09:51:23 修改
阅读量268 收藏
点赞数 1
文章标签： anti-design-vue
于 2023-08-07 17:19:56 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/mqb2222__/article/details/132150540
版权

我这里的项目是vue3+vite的，其他请参考官网

Ant Design官网只介绍了使用 unplugin-vue-components 自动按需引入组件Ant Design of Vue - Ant Design Vue (antdv.com)https://www.antdv.com/docs/vue/introduce-cn并没有介绍自动按需引入图标，在github上查询unplugin-vue-components时，发现已经有写对于图标的处理逻辑

 这样的话就不需要做一些别的额外操作，只需要添加一句代码就可以实现自动按需引入图标了

 经过测试，发现所有页面都可以使用到了图标，不需要再进行全局注册或手动按需引入了

你眼中的世界.
关注
  • 1
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 4
    评论
八）React项目实战记录：配置Antd样式的自动按需引入
jimson_zhu的博客
01-15 438
5.0版本以前需要手动配置自动按需引入，这里还是说一下吧。
基于 Ant Design of Vue 实现的 Ant Design Pro 源码
12-29
基于 Ant Design of Vue 实现的 Ant Design Pro 源码 安装依赖 npm install 开发模式运行 npm run serve 编译项目 npm run build
vue3项目中使用antd图标
Rain022111的博客
03-12 1168
在项目中使用ant-design组件库主要是分为基本组件和图标，组件和图标的包是不一样的。
vue3项目如何按需引入ant design vue组件和图标
weixin_42425569的博客
04-25 1496
3.按需引入，新建antDesignVue.js文件。1.下载babel-plugin-import插件。2.在babel.config文件中加入以下代码。完整babel.config文件。4.在mainjs文件组件并注册。
AntD Vue 组件库 icons 按需导入
最新发布
valsedefleurs的博客
06-27 393
Anti-design-vue 组件库icons按需导入
ant-design-vue按需引入icon以及组件
热门推荐
你华还是你华
05-12 2万+
大家好，我是Counterrr。 不忘初心 ，砥砺前行。共勉。
Ant Design Vue 组件或图标的引入和使用
WangYan的博客
07-21 2379
AntDesignVue组件或图标的引入和使用。
解决element plur的icon图标的无法按需引入的问题
m0_68320270的博客
09-20 755
/element 组件的按需引入。再说一些组件使用注意的问题吧。//按需引入icon图标组件。//安装icon图标组件。
SpringBoot+AntDesignVue实现excel导入功能
07-20
SpringBoot+AntDesignVue 实现 Excel 导入功能 在本篇文章中，我们将介绍如何使用 SpringBoot 和 AntDesignVue 实现 Excel 导入功能。这个功能主要是使用 Ant Design Vue 中的 upload 组件来实现导入 excel 文件的...
基于ant design vue 实现的一套后台管理框架.zip
05-16
基于ant design vue 实现的一套后台管理框架。主要使用vue3 + vuex + vue-router + ts 基于ant design vue 实现的一套后台管理框架。主要使用vue3 + vuex + vue-router + ts 基于...
ant自动获取文件路径
03-24
NULL 博文链接：https://xnbhnly.iteye.com/blog/1109967
ant-design-vue按需加载的坑的解决
11-20
然而，在实际开发过程中，我们可能会遇到一些技术挑战，例如按需加载（tree shaking）Ant Design Vue时出现的编译错误。本文将详细讨论这个问题以及如何解决。 首先，让我们了解问题的核心：在Vue CLI 4.x环境中，...
基于AntDesignofVue实现的AntDesignPro
08-13
**AntDesignPro详解** 在前端开发领域，Ant Design Pro 是一款强大的企业级前端框架，它基于流行的 Vue.js 框架构建，旨在提供快速、高效的企业级应用解决方案。本篇文章将深入探讨 Ant Design of Vue 与 Ant ...
Ant Design4.X引入阿里iconfont.cn图标
weixin_43422861的博客
11-30 162
参考：Ant Design(antd)4.X引入阿里iconfont.cn图标(Icon)
vue3项目学习记录＜二＞---Ant Design Vue组件之按需引入
Terenceno的博客
04-11 712
Ant Design Vue组件之按需引入
AntdVue引入的两种方式
qq_43405603的博客
02-23 4774
一、全局引入 1、npm i --save ant-design-vue 2、在main.js中 import Antd from 'ant-design-vue'; import 'ant-design-vue/dist/antd.css'; Vue.use(Antd); 二、按需引入 1、npm i --save ant-design-vue 2、在main.js中 import 'ant-design-vue/dist/antd.c......
vite配置ant自动引入
ae_pppppp的博客
02-16 1121
vite配置ant自动引入
vue3+element+AntDesign(自动导入)+pina+vite+js+pnpm搭建项目框架
qq_45585640的博客
04-10 1094
这样，就搭建好了一个基于Vue 3的项目框架，使用了Element UI、Ant Design、Pina、Vite、JavaScript和pnpm。你可以根据需要进一步开发和配置项目。记得将上面的URL替换为你自己的图标库地址。
ant design vue按需引入
06-28
Ant Design Vue 按需引入是指在使用 Ant Design Vue 组件库时，只引入需要使用的组件，而不是全部引入。这样可以减小项目的体积，提高页面加载速度。具体实现方式可以使用 babel-plugin-import 插件来实现。在 babel...
评论 4
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值