如何在uni-app使用iconfont

打开矢量图标库官网

官方地址：https://www.iconfont.cn/

登录账号

登录自己的账号

挑选图标加入购物车

1. 挑选图标，点击购物车
2. 添加至项目

下载

下载后是一个download.zip，解压这个文件

生成代码

点击生成

点击复制代码

替换

打开解压后文件夹，找到iconfont.css并且打开，注意红框内容，全部删除，替换成刚刚复制过来的代码

替换前

替换后

替换完毕之后，需要在//at前面加上https:

调用

1. 将解压后的文件夹重命名为 iconfont
2. 将iconfont文件夹放到项目根目录下的style目录，如果没有创建style目录
3. 在App.vue下引入css

@import './style/iconfont/iconfont.css';

引用如下

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

好了，记录一下，搞定！！！