css - 自动生成 web-/iconfont

Question

这些天您在每个网站上都能看到这些 - 现在几乎没有没有它们。图标字体几乎已经“接管”了。但是创建这些工具是一个问题 - 至少对我来说是这样。

由于我有视力障碍，我与一位可以为我制作 SVG 字形的设计师合作 - 每个字形都是单独存储的。例如:

arrow_left.svg
arrow_right.svg

现在，我没有任何字体编辑器或图形编辑器(如 Photoshop 或 Adob​​e Illustrator)来将图标组合成字体。而且我也是一个 Nerd ，我 95% 的开发都是在终端内完成的。比如创建一个发行版等等。

现在我决定要自动创建字体。当我们逐渐接近一组我真正喜欢并认为适合的图标时，我觉得是时候开始将其制作成合适的网络字体或 iconfont 了。这两个术语似乎用于同一事物。

我的主要开发环境包括 Github Atom、NodeJS 和 PHP。我不使用 Gulp 或 Grunt，而是使用 NPM 脚本。

我有什么方法可以自动生成网页字体？我想要实现的是:

• 有我的字体的 SVG、TTF、WOFF、EOT 文件。
• 无需担心 charmap，让工具来决定。
• 创建一个 CSS 文件以供使用。

Answer 1

根据您的工作流程，gulp-iconfont 可以完成这项工作 https://github.com/nfroidure/gulp-iconfont

还有 CLI 变体，参见 https://github.com/nfroidure/svgicons2svgfont

还有 gulp-iconfont-css 可以帮助生成您的样式。