Ant Design Vue通过iconfont构建自定义图标库

最新推荐文章于 2024-05-08 17:20:13 发布

萧明

最新推荐文章于 2024-05-08 17:20:13 发布

阅读量6.6k

点赞数 1

分类专栏： Vue 学习记录文章标签： Ant Design Vue iconfont 自定义icon

本文链接：https://blog.csdn.net/u010192145/article/details/103010554

版权

本文详细介绍了如何借助iconfont图标库创建并整合到Ant Design Vue项目中，通过下载iconfont图标，解析相关文件，尤其是iconfont.js，然后在项目中构建自定义图标组件。完成这些步骤后，开发者可以在Ant Design Vue组件中方便地使用自定义图标。

摘要由CSDN通过智能技术生成

虽然Ant Design Vue已经为我们内置了很多icon图标,我们很方便就能使用,但有时候有些图表我们还是系统能实现定义，本文主要介绍根据iconfont图标库创建自定义的icon图表,并在Ant Design Vue中使用

首先在iconfont里面将自己添加的图标添加到自定义项目后，下载压缩包，解压后你应该有如下结构：

iconfont.css
iconfont.eot
iconfont.js //这个js很重要
iconfont.json
iconfont.ttt
iconfont.svg
…其他文件

在Vue的工程的main.js中自定义图标组件,代码如下:

//引入Ant Design Vue中的icon
import {
   
  Icon
} from 'ant-design-vue'

//这个iconfont.js就是从iconfont.cn网站上下载后的解压JS文件
import iconFront from

关注