在小程序中使用阿里巴巴矢量图标库

在百度小程序或者其他小程序中使用阿里巴巴矢量图标库是为了提高小程序渲染加载，因为小程序文档内都不建议把所有的图片和图标文件放在小程序端，在小程序中使用阿里巴巴矢量图标库的字体图标，首先要在这个网站挑选合适的图标加入项目。

然后进入矢量图标项目生成代码（代码中的路径为 阿里云cdn加速路径，无需修改），如需要下载到本地，可存放在小程序项目内或云存储内，需修改代码内的路径，如下图：

 将复制出来的代码添加到 app.css 内，如下：

@font-face {   font-family: 'iconfont';  /* project id 458248 */   src: url('//at.alicdn.com/t/font_458248_m3uvknr8kixdpldi.eot');   src: url('//at.alicdn.com/t/font_458248_m3uvknr8kixdpldi.eot?#iefix') format('embedded-opentype'),   url('//at.alicdn.com/t/font_458248_m3uvknr8kixdpldi.woff') format('woff'),   url('//at.alicdn.com/t/font_458248_m3uvknr8kixdpldi.ttf') format('truetype'),   url('//at.alicdn.com/t/font_458248_m3uvknr8kixdpldi.svg#iconfont') format('svg'); }

 

这样就可以在项目内直接调用了，使用方法如下：

<i class='iconfont icon-shezhi'></i>

调用的方法有很多种，根据自己项目的实际使用标签来调用，没必要非要使用 i 标签。