1.1.1 • Published 3 years ago

@zeir/font-subset v1.1.1

Weekly downloads
-
License
MIT
Repository
github
Last release
3 years ago

font-subset

WEB字体子集化工具,提速字体加载/按需加载,内置谷歌、哔哩哔哩、小米的子集化方案

安装

npm install @zeir/font-subset --save
//or
pnpm add @zeir/font-subset

使用

首先将字体重命名为 ${fontFamily}-${fontSubFamily}.ttf 例如 MiSans-Regular.ttf,放在 ./source-fonts 目录(仅支持.ttf)

// index.js
import { fontSubset } from "@zeir/font-subset";
import glob from "glob";
import path from "path";

const __dirname = path.resolve();

const fontFiles = glob.sync('./source-fonts/*.ttf').map((file) => path.resolve(__dirname, './', file));

// 使用内置子集化方案
fontSubset({
  fontFiles,
  type: 'google',  // 'google' || 'bili' || 'xiaomi'
});

// 使用自定义子集化方案
fontSubset({
  fontFiles,
  customSubset: [[23,665,7989],[9856,67453]],  // [[unicode的十进制数字(子集组)],[unicode的十进制数字(子集组)],...]
});

// 添加CDN基础链接
fontSubset({
  fontFiles,
  type: 'google',  // 'google' || 'bili' || 'xiaomi'
  baseUrl: 'cdn.xxxxx.com/font/',
});

字体生成

node ./index.js


------ 当前使用 谷歌 子集化方案 ------
[ start ] ● 开始切片...
[ ok ] > MiSans-Regular.0.woff2
[ ok ] > MiSans-Regular.1.woff2
...
[ ok ] > MiSans-Regular.94.woff2
[ ok ] > MiSans-Regular.95.woff2
[ ok ] > MiSans-Regular.css
[ finish ] ✓ 已全部完成切片!

以上就子集化完成啦!字体文件在./fonts/${fontFamily} 目录里。

Reference

misans
中文 web font 切割工具

1.1.1

3 years ago

1.1.0

3 years ago

1.0.9

3 years ago

1.0.8

3 years ago

1.0.7

3 years ago

1.0.6

3 years ago

1.0.5

3 years ago

1.0.4

3 years ago

1.0.3

3 years ago

1.0.2

3 years ago

1.0.0

3 years ago