背景介绍
最近做一个移动端项目，字体要求使用思源宋体，包括常规、中、粗三种。
字体包比较大，上线后加载速度不理想。但页面中的文字都为静态，没有接口返回再渲染的情况。
所以考虑用font-spider将字体包优化，使其只包含页面中使用到的文字，可以大大减少体积。
解决方案
来自github：github.com/aui/font-sp…
安装
npm i font-spider
使用
font-spider 会找哪些类名的样式中定义了字体样式，再根据这些类名去获取对应的文字，从而对字体包进行处理。
经过多次试错，找到了正确但不是唯一的使用方式
1.将字体和html文件放在同一个目录下
2.将所有样式注销，只在html的head中写字体相关的css
3.不支持otf格式的字体
这里是将粗体和中体的文字从页面中复制出来放在了#bold和#medium中，常规体的文字仍散落在页面各处。在之前的试错中没有这样做，页面中的文字仍使用本身类名的样式，但结果好多文字没有被处理到，索性全部提取出来放在了一起。
一切准备好后，在终端输入font-spider index.html，如果是多个html页面则是*.html
成功后会输入如下：
如果输出结果为
<web font not found>则检查一下字体路径对不对，定义的字体名称是否正确。
一切结束后，字体包文件的体积大大缩小，同时会出现一个font-spider文件夹，里面是之前字体的备份。
