微信小程序如何引入图标

背景：

最近在写我的大作业！使用的技术是微信云开发，之前没有写过小程序，所以想法是先找一个写好的项目练习一下，在跟着视频教程学习过程中，视频中是所有的都是引入图片，我就想能不能引入iconfont，占用内存小，

实现：

我试了好几个方式都不是想要的或者根本行不通，最后通过一个文章实现了

1. 进入iconfont官网：https://www.iconfont.cn/ ，将想要的图标加入购物车，然后将购物车图标添加到对应的项目中，

2. 打开放iconfont的目标项目，将其代码下载至本地，我们会得到一个压缩包

3. 解压这个压缩包，并命名，我这里文件夹名为iconfont

4. 打开cmd，进入放iconfont的目录下，然后我们需要将这个iconfont转换成微信小程序能识别的代码，也就是生成一个我们想要的iconfont.wxss文件，我们需要在控制台这样做： npm install -g iconfont-tools 点击enter iconfont-tools 点击enter 会出来一个让我们输入信息的栏目，就想我们在初始化一个vue/react项目一样

5. 打开iconfont-wx 文件夹，就可以看见生成的目标文件iconfont-wxIcon.wxss

6. 这个时候我们就可以把这个目标文件粘贴到我们小程序项目的对应位置，

7. 我们在小程序项目的app.wxss这个文件中引入我们的iconfont

8. 使用它

   注意：

   我们可以打开iconfot-wxIcon.wxss文件看下，我们会发现这里t-icon就相当于iconfont;并且在使用具体的icon时候，我们写的是t-icon-bangzhu ，也就是在官方给的名字前面加了一个t-