在微信小程序中开发uni-app时，我遇到了几个有关字体设置的问题，这里记录了开发中的踩坑记录。在使用canvas渲染文字时，必须设置文字的字体大小为整数。此外，微信小程序对于文字字体集的兼容性较差。在iOS端，能成功设置的字体只有三种：'Arial', 'Courier New', 'Georgia'。而在Android端，只有'serif'和'nato'两种字体在canvas中生效，但在DOM中直接设置这两种字体没有任何变化。对于旧型号的Android手机，仅对英文有影响。有两条解决路径：重写H5页面使用webview嵌入小程序，或继续兼容操作。博主选择了后者，IOS端无需考虑，系统基本兼容前三种字体。对于Android端，尝试使用uni.loadFontFace引入'serif'和'nato'，但效果不佳。最终，将.ttf字体文件转为base64引入，仅保留英文后两种字体，整个包大小增加了60KB。在CSS文件中，通过系统判断引入base64处理后的字体。不同平台对字体的兼容性存在差异，最完美的方法可能是使用webview。若需对中文兼容，引入相应的中文字体集，但会导致包体积过大。可尝试动态抽取需要的文字，只引入所需字体，后续可能有更详细的方法分享。下期将继续分享uni-app实战中的经验，敬请期待。欢迎关注、留言，您的支持是我的动力。
