手册版本 V3.0

01 uni-app 普通模式及微信小程序模式

1.1 打开 https://www.iconfont.cn/ 阿里巴巴图标库官网;

1.2 搜索图标

1.3 选择并添加好图标后点击购物车按钮，将所选图标添加到一个项目内:

1.4 点击项目内的生成代码按钮,生成代码及字体路径:

1.5 在 uni-app 或者小程序内使用字体路径方式导入并使用图标

/* 此处也可以将 字体文件 .ttf 下载并部署到项目的 static 目录内 */
@font-face {
    font-family:"gFont"; 
    src:url('https://at.alicdn.com/t/font_1348787_pdws9521tg.ttf') format('truetype');}
    // url 改成对应生成的字体url 地址, 注意以  https冒号 开始
    .your-icon{font-family:"gFont" !important; font-size:60rpx; font-style:normal;}
    .your-icon-1:before{content:"\e600";}
    .your-icon-2:before{content:"\e600";}
    //多个图标添加多个 .your-icon-具体名称:before{content:"\对应编码";}即可
    // 此处的 e600 来自 项目内有阿里图标库指定, 见下图:

1.6 在页面中应用图标

<text class="your-icon your-icon-1"></text>
<view class="your-icon">&#e602;</view>

02 weex 模式下图标扩展

1 - 4 步骤同上;
2.5 注意我们使用阿里图标库默认的字体名称为 iconfont（GraceUI 默认此名称），如果您引入了多个图标库字体名称都为 iconfont 会引起字体冲突，解决方案 : 

点击项目右侧的更多操作按钮 > 点击编辑

将字体名称改为您自己的字体名称即可;

2.6 在 app.vue 内加载字体、声明字体

<script>
export default {
	onLaunch: function() {
		// #ifdef APP-PLUS
		plus.screen.lockOrientation('portrait-primary'); //锁定屏幕
		const dom = weex.requireModule('dom');
		dom.addRule('fontFace', {
			'fontFamily': "字体名称 如 myfont",
			'src': "url('https://at.alicdn.com/t/font_823462_m4rz0iqup9.ttf')"
		});
		// #endif
	}
}
</script>
<style>
/* #ifdef APP-PLUS-NVUE */
.myiconfont{font-family:myfont;}
/* #endif */
</style>

2.7 在页面上使用text标签展示字体

<text class="myiconfont">图标的 UniCode</text>

注意 weex 模式下不支持变量形式的  UniCode ！