uniapp 开发小程序使用iconfont图标方法

1、进入阿里巴巴矢量图标库 https://www.iconfont.cn/ 添加图标到项目，然后下载至本地

解压后的本地文件如下

2、下载iconfont-tools

1. npm install -g iconfont-tools  全局安装

2. 打开下载好的图标文件夹，如上图所示目录，在下载好的文件夹下通过cmd命令打开

3. 然后在cmd窗口执行 iconfont-tools 命令

4. 然后一直enter,然后就会多出来一个iconfont-weapp的文件夹

进入iconfont-weapp文件夹,将其中的iconfont-weapp-icon.css复制出来放入项目中的static目录下，然后在App.vue引入该文件就可以了

@import './static/iconfont-weapp-icon.css';

 

3、页面中的使用方法

其中t-icon是必须添加的

<view class="t-icon icon-dianhua"></view>


<view class="t-icon icon-dianhua t-icon-sm"></view>
<view class="t-icon icon-dianhua t-icon-md"></view>
<view class="t-icon icon-dianhua t-icon-lg"></view>