字体压缩(字蛛font-spider)

字体压缩(字蛛 font-spider)

在我们的网页中为了使页面好看会用到各种各样的字体,但是每种字体就用了短短的几句话而要引入整个字体文件实在是不太好,占用空间资源不说,那网络加载更是让人头疼,下面我来介绍一种方法,压缩字体文件


1.安装依赖

  • nodejs
  • font-spider

安装font-spider

    npm install font-spider -g

写一个demo.html用来展示

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>压缩字体</title>
  <style>
    @font-face {
      font-family: 'Source';
      src: url('Source.TTF');
      src:
        url('Source.eot?#font-spider') format('embedded-opentype'),
        url('Source.woff') format('woff'),
        url('Source.ttf') format('truetype'),
        url('Source.svg') format('svg');
      font-weight: normal;
      font-style: normal;
    }

    .fontyasuo {
      font-family: 'Source';
    }
  </style>
</head>

<body>
  <p class="fontyasuo">测试字体压缩</p>
</body>

</html>

注意:字体压缩后的字体文件中只有你在上面用到过的文字,故在使用过程中整理清楚都是用到了哪些文字

最后执行

 font-spider ./demo.html
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。