vue项目正确引入iconfont详细操作

最近写项目卡在iconfont的引入上面，实在太粗心了呜呜呜，浪费了好多时间，以此片记录一下！

1、选择想要的图标加入购物车，官网地址

2、点击右上角购物车图标。点击下载代码，并添加至项目。

注意：下载代码要记住指定位置。添加项目可以添加到以前的项目，没有项目就创建项目。

3、将下载好的代码文件放入项目中的assets目录的styles下

iconfont.css直接放在styles下

在styles目录下新建目录iconfont，将iconfont.ttf、iconfont.woff、iconfont.woff2放在里面

一共是复制了四个文件

4、到iconfont.css文件中修改路径

（我就是忽略了这一步，所以一直出错，还下载了css-loader反正一堆网上找了方法没解决，后面才发现是路径的问题，弄了一上午...o(╥﹏╥)o）

不修改服务器不会报错，所以一直不知道是这里的问题

5、到main.js中引入iconfont.css文件

6、点击资源管理下的我的项目，找到刚才项目下的图标

7、复制图标的代码后再指定位置使用

注意：引用的图标一定要有class=“iconfont”

（好吧这里我忘了加，所以一直不出现，同学们不要像我这里傻缺）

成功引入图标

如果没有写class图标是这样的

好了，到这里就可以随心所欲的使用你的图标了，希望这篇帖子能帮助到宝子们，完结✿✿ヽ(°▽°)ノ✿