font-spider压缩字体文件--vue项目用法
·
这个只能压缩固定的文字,如果有需要用到的不在压缩范围文字可能还会显示系统字体;
可用的字体网站:
http://www.zitiweb.com/index.php?p=1
http://font.chinaz.com/index_2.html
http://www.diyiziti.com/List/kaishu
确保电脑上有node.js
首先安装font-spider:
npm install font-spider -g
然后再桌面上新建一个文件夹index,文件夹内部结构如下:

上面的.font-spider是我压缩后自动生成的文件,里面保存的是原本的字体文件。
在index.html引入css\index.css,index.html内部如下:

蓝色部分是ya 哦用到的所有文字,红色部分是这些文字对应字体。
打开cmd:
先检查一下font-spider是否安装成功:font-spider -V(大写的)
对应出现了版本号则,安装成功;
然后cd 到桌面的index文件夹,接着执行font-spider *.html命令

上面我压缩了两个字体文件,一个是苏新诗柳楷繁,一个是苏新诗柳楷体 。
压缩成功:
压缩好的字体文件在index文件夹下面的font文件夹下面:
红色框里的是原本的字体文件;

比较一下,小了很多类。
如果你是普通的h5页面,可以直接在你的h5文件夹里面压缩,如果是vue项目,就需要单独的给字体新建这样的index文件夹然后压缩。
最后在给压缩好的字体文件包拷贝到vue项目中。
更多推荐

所有评论(0)