前言

日常前端页面的开发中偶尔会使用到矢量图标，常用以iconfont矢量图标库为主，因其使用快捷且方便

但在小程序对文件格式中确发现不能直接引用，需要一些额外的步骤，本文就此作简要说明

（iconfont的基本使用官网有示例，此处不作过多说明）

IconFont官网地址

www.iconfont.cn/

---

小程序对文件的格式有所限制，从iconfont下载过来的字体包无法直接引用，需要对其中的 ttf 文件进行转换

在线转换地址：transfonter.org/

点击 'Add fonts'上传 ttf 文件，选择Base64 encode 并勾选TTF格式，点击Convert即开始转换

转换完成后，点击Download下载到本地并解压

完成解压后，将解压内容中stylesheet.css的文件内容复制到小程序app.wxss中，如：

复制iconfont字体包中iconfont.css的文件内容（第二栏起）到小程序app.wxss中，如：

按需引用

<span class="iconfont iconfont-xxxx"></span>

使用结果示例