在微信小程序使用外部字体_微信小程序引用外部字体

有了解过微信小程序的朋友都应该知道，微信小程序其实说白了就是一个浏览器，一个基于webkit内核的浏览器，我们浏览特定的小程序其实就是在浏览特定的网页，但是问题是这个浏览器和同样基于webkit内核的其他浏览器比如chrome并不一样，他是一个内核被修改过的浏览器，而且你完全不知道到底修改了些什么？到底哪些功能被改掉了？在修改的过程中又留下了一些什么坑，当然本文并不旨在谈论这些坑和其解决方案，因为太多了，本文的重点是如何在小程序中使用外部字体。

其实对于一般的需求，系统预置的字体已经够用了，但是总归会有使用到外部字体的时候，在普通浏览器中我 们可以直接在css中导入本地字体或者一个网络字体，但是这种方式在微信小程序中并不适用（网络字体并不是不行不过会有诸多限制，而且中文字体一般都不小，请求很耗时的），那么我们如何导入外部字体呢？对于图片我们可以转换成base64，然后直接通过dataUrl来访问，那么对于字体我们是不是也能做同样的操作呢？答案当然是可以的，我们需要借助一个第三方网站。https://transfonter.org/

具体如何操作呢？

1、首先找到我们需要使用的字体文件包，格式的话TTF, WOFF, WOFF2， SVG随便哪一种都可以,但是大小不要超过10MB，如果文件大小超过10MB，我们也可以通过字蛛（font-spider）服务来压缩，具体使用方式这里不细说，可以去官网了解安装及使用方式，官网链接：http://font-spider.org/

2、打开我们上面提到的转换网站：