vue引入icon,vue的icon图标

　　本文主要介绍了利用iconfont对vue文件的分析，具有很好的参考价值。希望对你有帮助。如有错误或不足之处，请不吝赐教。

目录

　　 vue在项目中正确使用iconfont。

vue使用iconfont

　　1.将字体文件导入资源。

　　2.导入main.js

　　导入“@/assets/icon/icon font . CSS”；

　　3.使用

　　注意前面一定要加iconfont，否则就是空框。

　　div class= icon font icon-label /div

项目中正确使用iconfont

　　1.打开iconFont官网，选择自己喜欢的图标，添加购物车。

　　2.单击购物车，将其添加到项目中。

　　3.本地下载。

　　4.将我们下载的文件iconfont.css和iconfont.ttf放在项目资源文件夹中(您可以创建一个css文件或iconfont文件)

　　5.将iconfont.css样式引入main.js

　　“导入”。/assets/iconfont/iconfont.css

　　6.vue文件中的引用

　　I class= icon font icon-ziti GUI-xianxing /I

　　7.如果您报告了一个错误，您需要下载css-loader依赖包。

　　npm安装CSS-加载程序-保存

　　以上个人经历，希望能给大家一个参考，也希望大家多多支持我们。

郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。