开发过微信小程序或者公众号的朋友应该都知道，微信是一个相对封闭的软件。无法直接下载文件，也无法跳转到小程序中的其他链接。但万万没想到的是，小程序其实还无法直接使用第三方字体。虽然小程序提供了wx.()加载字体的API，但是博主尝试了很多次，无论是模拟器还是真机都没有效果。这可能是由于字体文件的大小造成的。限制？也许我只是太天真了。经过一番+百度，终于找到了解决方案。

自定义字体方法1.压缩字体

小程序最终打包大小限制为单个包2M，总包8M。有些字体文件很容易达到 6、7M 甚至更大。如果只显示几个单词，则无需包含整个字体，因此需要先检查字体大小。压缩。您可以使用“Word ”来压缩字体。

步骤如下：

在电脑上安装Node.js，在命令行输入npm font- -g即可安装Word 。新建一个HTML文件和CSS文件，在CSS中引用字体，在HTML中输入要压缩的文本。请记住设置文本的字体样式。 。字体文件必须是 TTF 格式。从命令行运行 Font-

在第 3 步中，CSS 样式表定义如下：

@font-face { font-family: MyFontName;//自定义字体名称 src: url(../Gloss_And_Bloom.ttf) }

然后，具体使用：

这样压缩后得到的字体文件大小只有几千字节，但只适合渲染HTML中输入的少数文字，对于其他文本无效。字体大小和压缩字体效果如下。

2.字体文件转码

小程序中不能使用@font-face直接引入字体。您需要对字体进行转码。如果您不确定该字体所应用的文本，您可以对整个字体文件进行转码而不压缩，但转码后的文件会更大。大约有十几兆字节。

转码操作如下：

首先打开在线转换工具并上传字体文件。设置如下所示的选项，然后单击进行转换。

转换完成后，下载并解压得到css文件。选择css文件中的内容（类似下图），复制粘贴到wxss中。

这样我们就可以在小程序中直接使用font-:来引用了。

效果示例：