vue引入iconfon报错失败!

报错内容:找不到某些文件

错误分析:百分99的人 都是把图标添加到购物车下载代码,一定要记得添加到项目里面 否则引用里的链接会找不到图标导致出错

第一步:打开iconfont官网、将你需要的图标添加至购物车

在这里插入图片描述

第二步:随意创建个项目命

在这里插入图片描述

第三步:下载到本地

在这里插入图片描述

然后你会得到一个本地下载的文件

在这里插入图片描述

这时你会得到一个以下几个文件

在这里插入图片描述

把这些东西拉进你的vue项目中、本人的静态文件都放在了src/assets/icon/文件中

在这里插入图片描述

拉近后在main.js文件中引入下面那一行代码就行

import './assets/icon/iconfont.css';

引入后使用浏览器打开demo.html文件

这是下载后打开你需要引入的图片

在这里插入图片描述

紧接着在你的项目中随意找个页面测试下 代码规范demo.html里面写的很清楚。

<i class="iconfont icon-saoyisao"></i>

这时你会发现成功了。
在这里插入图片描述

Logo

前往低代码交流专区

更多推荐