在ionic3中自定义自己的图标字体

资源：阿里图标字体库

step1：寻找资源

搜索图标字体库，找到自己需要的图标字体并加入购物车。
添加到已存在的项目或者创建新的项目。

step2：下载资源

选择Font class类型，点击下载到本地。
下载完成后，解压缩，会得到一个字体文件夹。
将字体文件中的：

iconfont.css
iconfont.eot
iconfont.svg
iconfont.ttf
iconfont.woff

五个文件拷贝到src/assets/fonts目录下并将iconfont.css改为iconfont.scss（如果你的ionic用的是scss的话）
在项目的src/theme/variables.scss中加入下面代码

$font-path: "../assets/iconfont";

step4：设置

打开fonts.scss文件并修改：

// 设置你的icon的统一样式
.you-icon-name { // 如果多个name，则以.name1,.name2,.name3形式
  font-family: "iconfont" !important;
  font-size: 16px;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
// 自定义自己的icon名称，后面的content值，参考原文件中的contnet
.you-icon-name:before{ content: "\e648"; }

完成后保存文件，重启ionic serve

step5：使用

在你的项目中，在需要使用此图标字体的地方，使用：

step6：更新

如果以后需要更新图标库，只需要在阿里图标库的项目中添加新的图标字体，并下载下来后替换原有的文件，并设置fonts.css中的图标文字，当然你也可以不改。