【vue开发基础】之使用阿里巴巴矢量图标库

❤ 写在前面

如果觉得对你有帮助的话，点个小❤❤ 吧，你的支持是对我最大的鼓励~

---

第一步 准备工作

前往阿里巴巴矢量图边库，选择并下载你需要的图标

（1）加入购物车


（2）下载代码

（3）解压并打开文件夹

（4）打开demo_index.html，选择Font class这种方式引用

第二步 导入到项目

（1）在assets文件夹下，新建一个文件夹，把iconfont.css 和iconfont.ttf文件导入进来

（2）在main.js配置中 引入这个iconfont.css

import './assets/font/iconfont.css'

（3）更新图标库
按第一步进行操作，将iconfont.css 和iconfont.ttf文件替换即可完成

第三步 使用图标

<span class="iconfont icon-shouye"></span>

到此就结束了，如果有什么不懂的，可以评论或私聊我喔