在uni-app项目中使用阿里巴巴矢量图标库

在uni-app项目中使用阿里巴巴矢量图标库

• 在阿里巴巴矢量图标库创建一个项目，并选择需要的图标添加到该项目中。
• 下载项目图标并解压，将iconfont.ttf文件拷贝到项目的static目录下。及使用字体图标，因为可以动态修改图标颜色，很方便；svg彩色图标是好看，但是支持不是很全
• 在项目根目录的App.vue文件中进行全局引用：

<style>
/*导入字体图标*/
@font-face {
	font-family: 'iconfont';
	src: url('~@/static/iconfont.ttf') format('truetype');
}
/*设置字体图标*/
.iconfont {
	font-family: "iconfont" !important;
	font-size: 1em;
	font-style: normal;
}
style>

• 在页面中随意使用字体图标：如果图标unicode码不清楚可以在阿里图标库中查看或复制

<text class="iconfont">text>