简介
在前端开发中，使用字体图标已经成为一种常见的方式。@influans/fontastic-generation 是一个基于 Node.js 的 npm 包，可以方便地生成自己的字体图标。
安装
npm install -g @influans/fontastic-generation
创建项目
fontastic-generation create new-icons
执行上述命令后，将会创建名为 new-icons 的文件夹，并包含以下几个文件：
config.json：配置文件，可自定义字体名称、样式等。icons文件夹：存放图标的 SVG 文件。css文件夹：存放生成的 CSS 文件。fonts文件夹：存放生成的字体文件。
添加图标
在 icons 文件夹中添加 SVG 格式的图标。注意，多个图标可以放在同一个 SVG 文件中。
构建
fontastic-generation build new-icons
执行上述命令后，将会生成以下文件：
css/fonts.css：CSS 文件，引入字体和图标样式。fonts/：包含字体文件。
使用
将生成的字体文件和 CSS 文件引入到网页中即可使用图标，示例如下：
-- -------------------- ---- -------
--------- -----
------
------
----- ---------------- ------------------------
-------
------
-- ----------- --------------
-------
-------配置文件
在 config.json 文件中可以配置字体名称、字体样式、图标前缀等。
{
"fontName": "new-icons",
"fontStyle": {},
"iconsPrefix": "icon-"
}其中，fontName 指定字体名称，fontStyle 指定字体样式，iconsPrefix 指定图标前缀。更多配置项请查看官方文档。
结语
使用 @influans/fontastic-generation 可以轻松地创建和管理自己的字体图标库。希望这篇文章对大家有所帮助，并可以在实际前端开发中得到应用。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60065f7b238a385564ab6a0e