uniapp 字体引入

uniapp 字体引入

uniapp 小程序引用字体

官方链接

我们用到的字体可能会很大，比如我用到的阿里普惠字体就有8M，这么大的字体不管是放服务器还是放小程序内都是很不好的，页面加载很慢。
千万不要把8M的文件转成beas64放入编辑器内，我试过，vccode还好，HbuildX直接卡死。
推荐一个压缩插件 font-spider

font-spider会帮我们剔除不需要的文字
比如你需要某一个特殊字体，而项目中只有标题 分类啥的可以用到那就推荐你使用这个。比如我项目只用到大概五十多个字。
把文字写在html文件的div里面
在html页面引入自己需要的特殊字体
font-spider会根据你页面使用到的字体和文字去压缩
这样压缩完后，差不多8M的字体文件，只需要几十kb

执行 npm install font-spider -g下载后，cd切换到自己的index.html执行 font-spider ./index.html

这样就压缩好了。
把压缩好的文件拿到项目里面
uniapp 就放在static里面
在app.vue页面 的style里面使用

 @font-face {font-family: 'AlibabaPuHuiTiH';  //这个名称可以自己随便定义src: url('~@/static/f');}

这样页面就可以使用特殊字体了。
有问题的可以联系我，给大家发dome