uniapp中阿里矢量图Symbol方式引入iconfont彩色字体图标

本起说一下在uniapp中如何使用阿里矢量图的Symbol方式引入iconfont彩色字体图标。

1. 首先在阿里矢量图中吧需要素材放到购物车中——iconfont-阿里巴巴矢量图标库

   

2. 将图标打包下载到本地

   

3. 然后解压之后放到vue项目中然后打开终端cd到对应目录下。

   

4. 输入命令行：npm install -g iconfont-tools或cnpm install -g iconfont-tools，然后执行完毕之后再输入 iconfont-tools，然后一直回车就行。

5. 最后iconfont图标的引入，在APP.vue引入刚刚生成的文件iconfont-weapp下的iconfont-weapp-icon.css。

   @import "你的路径/iconfont/iconfont-weapp/iconfont-weapp-icon.css";

   

6. 然后再main.js中也引入一份(虽然暂时还是有点不理解为啥要在这里引入，因为不引入也有效果)。

   

7. 引入示例

   <view class="t-icon t-icon-图标名"></view>