uni-app引入字体图标详细步骤

之前自己在学习中不会引入矢量图，在网上搜索方法，没找到一个详细的，自己动手记录一下。

uni-app引入字体图标

1、在案例矢量图官网选择需要的图标进行下载

2、得到如下文件

3、将文件中的六个文件放进项目里面，就是下面截图的那六个即可

4、在全局App.vue中引入

引入后会报如下错误

5、解决方式
进入你引入的字体图标中的iconfont.css中注意下下图标红的地方路径需要修改一下就好了。

6、按照如下图的修改方式即可解决
~@：是固定写法
static：就是存放字体图标的文件的文件夹
icon：是字体图标的文件夹

7、然后就可以在页面正常使用了
在下载的字体图标的文件中店家那个html文件进入如下页面

复制你需要使用的字体图标对应的类名

iconfont必须加上，iconfont后面的类名就是你要使用的字体图标的类名