开启掘金成长之旅！这是我参与「掘金日新计划 · 12 月更文挑战」的第 5 天，点击查看活动详情
一、SvgToFont
为了方便开发者快速生成图标字体文件（.ttf）和 Flutter Icon Class 文件，我们开发了 svg_to_font ，通过这个工具库您可以轻松愉快的使用字体图标👏🏻👏🏻👏🏻。
二、SvgToFont 解决的痛点
如果在您的业务中经常会使用到 Icon 是不是有以下痛点，那么 svg_to_font 将会是你的不二选择：
- 经常去设计稿中下载一些小的图片作为
Icon，这些尺寸比较大； - 为了避免 1 中出现的痛点，会让设计师设计
Icon图标导入到第三方平台，如：iconfont 等，使用的时候需要进行下载图标 & 字体文件，导入到项目中，再手写Flutter Icon Class文件，每当添加新的图标，都需要手动执行一次上述步骤，而且容易出错； - 手写
Flutter Icon Class文件，在使用的时候，需要对照第三方平台，查看Unicode码该使用那个图标。
如果您在开发中经常会遇到以上问题，那么使用 svg_to_font 将会是您的最佳选择，您只需下载 SVG 类型的图标，执行以下 svg_to_font 的命令，将会自动为您生成 .ttf 文件 & Flutter Icon Class 文件，而且不会出错，它还支持 Icon 预览。
三、环境要求
由于 svg_to_font 工具库部分依赖于 NodeJS，需要使用者在本机安装 Node.JS V10+。如果已经安装过，可以忽略，如果未安装，需要自行下载安装。
四、安装
dart pub global activate svg_to_font
五、使用教程
- 准备素材：把
SVG icon放进Flutter项目某个文件夹里，例如：example/assets； - 生成产物：
svg_to_font generate --input=./example/assets --font-output=./example/assets/fonts --class-output=./example/lib
- 使用产物：在
pubspec.yaml中添加如下代码：
fonts:
- family: CamusIcons
fonts:
- asset: assets/fonts/camus_icons.ttf
六、参数
| parameter | description | default |
|---|---|---|
| --help | 帮助 | -- |
| --input | SVG 输入目录 | -- |
| --font-output | .ttf 文件输出目录 | -- |
| --class-output | Flutter Icon Class 输出目录 | -- |
| --name | Flutter Icon class 名称 | CamusIcons |
| --delete-input | 是否删除 SVG 原始文件，如果为 false 可以进行预览 | false |
七、项目地址
- GitHub: github.com/camus-desig…
- Pub：pub.dev/packages/sv…
