在小程序中使用在线的iconfont

本教程是在线使用iconfont, 不需要把文件引入小程序的办法!

一、准备项目

首先在官网https://www.iconfont.cn/ 创建项目, 添加好图标, 通常找UI协助

image.png

点击unicode选项 (重要), 复制红框代码, 点击旁边的下载至本地, 解压文件, 打开iconfont.css, 按下面图片操作

image.png

二、在微信小程序中引用

复制你最终的 iconfont.css 的内容到你的微信小程序的 app.wcss 全局引入, 我用的是Taro如下图, 道理是一致的

image.png

然后就可以用 <text class="iconfont icon-right"></text> 这样调用了

image.png

三、上线可能需要在微信后台添加 downloadFile 合法域名 at.alicdn.com