以编程方式将 webfont 拆分为多个 unicode 范围

Question

如何将包含拉丁字符、西里尔字符和中文字符的 woff2 文件拆分为 3 个不同的文件，最好使用 nodejs/grunt？

有没有办法自动确定不同集合的开始和结束点？

我试过 unicode-range-splitter 但它只是将我的字体分成同样大的块，这无助于我实现我的目标。

我也查看了 grunt-webfont-svg-extractor in conjunction with grunt-fonts，但由于这些工具并非完全针对此要求而构建，因此配置非常长且容易出错。

Answer 1

没有明确的 begin 和 end 分隔符来标记每组拉丁文、西里尔文和中文字符。

您可以指定一个 unicode 范围（即 from/to），作为区分 begin 和 [=每个 set/block 的 46=]end。例如，下面是一些相关的范围：

Unicode 范围

Name	From	To
Basic Latin	`U+0000`	`U+007F`
Cyrillic	`U+0400`	`U+04FF`
CJK Unified Ideographs	`U+4E00`	`U+9FFF`
...

完整的 unicode 列表 blocks/ranges 可以在 here.

中找到

工具

没有特定的 grunt 插件，也没有 nodejs 解决方案来执行我所知道的字体拆分。但是有fonttools，它写在Python中，包括一个名为pyftsubset.

的命令

下面是使用pyftsubset命令的例子（取自this blog并稍作改编）:

$ pyftsubset My-Awesome-Font-Regular.ttf \
    --unicodes="U+0400-04FF" \
    --layout-features="" \
    --flavor="woff" \
    --output-file="My-Awesome-Font-Cyrillic.woff"

请注意上面命令中的 --unicodes 选项 - 这是您指定要包含的字符范围（即子集）的地方。

可以找到 pyftsubset 命令的各种选项及其描述 here。

Answer 2

使用Font-Ranger：https://www.npmjs.com/package/font-ranger

使用 font-ranger 您可以：

为您支持的每种语言生成子集
消除字体的臃肿并针对网络优化它们
将您的字体转换为压缩的 woff2 格式
为旧版浏览器提供 .woff 回退
使用@font-face 规则生成CSS 个文件
使用 Node.js API

以编程方式将 webfont 拆分为多个 unicode 范围

Programmatically split webfont to multiple unicode ranges

fonts

node.js

gruntjs