详解node字体压缩插件font-spider的用法
更新时间：2018年09月28日 11:48:04 投稿：laozhang
在本篇文章中给大家详细讲述了node字体压缩插件font-spider的用法的相关知识点内容，有需要的朋友参考下。
需求：
根据甲方要求，使用UI中指定字体
移动端默认显示系统默认字体，非系统默认字体需要自行引入字体包
字体包过大，字体包通常在几MB，严重拖累页面加载速度
分析：
文本内容为固定内容，不需要更新
文本内容大多为常用文字，大多文字用不上
插件：
font-spider node 安装插件方法：npm install font-spider -g
操作：
安装插件
提取项目文字：
创建一个临时html，将所有项目需要用到的文本放到html中
在htmnl中写入样式代码，举个栗子：
@font-face {
font-family: 'myfont';
src: url('./common/assets/font/myfont.ttf');
}
* {
font-family: 'myfont';
}
在命令提示窗口中，将目录展开到html所在的目录，输入指令：font-spider *.html 即可将该目录下所有html的字体抽离打包。
注意：
如果页面文本内容需要经常更新
如果需要对input表单内容同样应用定制字体请放弃本文章所述方法，可以考虑通过服务端渲染，动态生成字体包，或者，老老实实将完整的字体包引入页面
相关文章
在生产环境中,更常见的做法是使用专门的日志记录库,如winston、log4js等,来实现更灵活和可配置的日志记录功能,本篇文章将介绍的是winston的强大的日志记录功能,快跟随小编一起学习一下吧2024-01-01
这篇文章主要给大家介绍了关于npm安装yarn后找不到yarn报错的解决过程,文中通过图文介绍的非常详细,对遇到同样问题的同学具有一定的参考性,需要的朋友可以参考下2023-04-04
这篇文章主要介绍了Node.js 制作实时多人游戏框架,需要的朋友可以参考下2015-01-01
这篇文章主要介绍了Node.js一行命令上传本地文件到服务器，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2019-04-04
这篇文章主要为大家介绍了一款吊打Node或Deno的现代JS运行时，Bun入门学习教程，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪2022-07-07
本篇文章给大家总结了node.js博客项目开发的相关步骤以及知识点分享，有兴趣的朋友参考下。2018-03-03
这篇文章主要介绍了M2实现Nodejs项目自动部署的方法步骤，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2019-05-05
node.js中的fs.readlinkSync方法使用说明
这篇文章主要介绍了node.js中的fs.readlinkSync方法使用说明,本文介绍了fs.readlinkSync方法说明、语法、接收参数、使用实例和实现源码,需要的朋友可以参考下2014-12-12
解决node-webkit 不支持html5播放mp4视频的方法
本文给大家分享的是解决node-webkit 不支持html5播放mp4视频的方法，其原因大概是因为node-webkit没有购买mp4格式的专利授权，恩，我们来想个办法来解决这个事情吧。2015-03-03
Node.js是一套用来编写高性能网络服务器的JavaScript工具包，一系列的变化由此开始。这篇文章主要给大家介绍了如何快速搭建Node.Js服务器的方法教程，文中介绍的非常详细，对大家具有一定的参考价值，需要的朋友下面来一起看看吧。2017-03-03
最新评论