iconfont Pub

只需一行命令,即可快速生成https://www.iconfont.cn/的Icon文件。

特点

  1. 支持多个 iconfont 项目。
  2. 自动识别 family
  3. 可自动在 pubspec.yaml 中注册字体
  4. 支持 font class 链接生成文件

运行

方式1

安装

flutter pub global activate iconfont 或者 dart pub global activate iconfont

指定版本安装 flutter pub global activate iconfont $version 或者 dart pub global activate iconfont $version

卸载

flutter pub global deactivate iconfont 或者 dart pub global deactivate iconfont

使用

iconfont

方式2

安装

pubspec.yaml 中添加

dev_dependencies:
  iconfont: #latest version

使用

flutter packages pub run iconfont

参数

-c, --css        font css的链接,例如(http://at.alicdn.com/t/font_1500681_sz0skwerbw.css)
                 (defaults to "")
-d, --dir        自动生成的assets文件夹名
                 (defaults to "")
-i, --in         iconfont文件所在目录
                 (defaults to "assets/fonts/")
-o, --out        生成后文件存放目录
                 (defaults to "lib/icons/")
-p, --package    fontPackage
                 (defaults to "")
    --config     config file path
                 (defaults to "pubspec.yaml")
-h, --help       help

常见问题

  1. iconfont command not found

例子

场景1

通过 Font css 链接生成 Icon 文件

运行 iconfont -c http://at.alicdn.com/t/font_1500681_sz0skwerbw.css -d my_icons

场景2

下载 .zip 文件,手动创建文件夹,将 iconfont.jsoniconfont.ttf 文件放入新创建的文件夹中。

运行 iconfont

场景3

使用配置文件 pubspec.yaml

# pubspec.yaml
iconfont:
  - icons: 
    - css: //at.alicdn.com/t/font_1500681_sz0skwerbw.css
      dir: test_icons
    in: assets/fonts2
    out: lib/icons/

  - icons: 
    - css: //at.alicdn.com/t/font_1500681_sz0skwerbw.css
      dir: my_icons

  - icons:
    - css: //at.alicdn.com/t/font_1932408_c19dd499jfh.css
      dir: my_icons2

运行 iconfont

新建配置文件 iconfont.yaml

# iconfont.yaml
- icons: 
    - css: //at.alicdn.com/t/font_1500681_sz0skwerbw.css
      dir: my_icons
      package: myPackage
  in: assets/fonts0/
  out: lib/xxicon

- icons: 
    - css: //at.alicdn.com/t/font_1500681_sz0skwerbw.css
      dir: test_icons
  in: assets/fonts1/
  out: lib/xxicon

- icons: 
    - css: //at.alicdn.com/t/font_1500681_sz0skwerbw.css
      dir: test_icons
  in: assers/fonts2
  out: lib/icons/

- icons: 
    - css: //at.alicdn.com/t/font_1500681_sz0skwerbw.css
      dir: my_icons

运行 iconfont --config iconfont.yaml

Libraries

iconfont