uni-app使用字体图标（iconfont）

离线使用字体图标

1、打开阿里巴巴字体图标网站，选择图标库

2、选择想要的图标，点击购物车图标添加入库，依次添加想要的图标，完成后点击右上角的购物车图标

3、点击添加至项目（如果没有新建过项目，这里会显示“添加项目”），选择（或新增）一个项目

 

4、点击下载至本地

 

5、解压下载的文件，复制iconfont.css至项目的static目录下

注意：在一些小程序或者应用上图标不显示(如钉钉)，原因可能是该小程序不是基于谷歌浏览器的webkit引擎，这时我们需要保留所有引用方式，需要将下载的eot、wooff、svg文件都添加至static中，也就是iconfont.eot，iconfont.woff，iconfont.svg等

 

6、按照以下描述处理文件

注意：在一些小程序或者应用上图标不显示(如钉钉)，原因可能是该小程序不是基于谷歌浏览器的webkit引擎，这时我们需要保留所有引用方式，将下载的eot、wooff、svg文件都添加至static中，也就是iconfont.eot，iconfont.woff，iconfont.svg等，并且路径需要修改为'/static/iconfont.eot'

 

7、处理完成后的文件

8、在APP.vue中引入图标

 

9、页面中使用

 10、运行效果

 

在线使用字体图标请点击此链接