找了很多文章货抄，發(fā)現(xiàn)大部分是掛著vuecli3的名，實際是vuecli2.x的內(nèi)容心铃，在請教大佬后，還是決定記錄下來挫剑，為前來踩坑的小伙伴填一些坑去扣。
大家可以看到官方文檔里面寫了圖標使用方法，結(jié)果根據(jù)官方文檔來寫樊破，就會發(fā)現(xiàn)圖標報出?
![]()
圖片.png
圖片.png
到處找是不是自己哪里和文檔的步驟不一樣愉棱，是不是少了啥，然后又跟著文檔走一遍哲戚，還是不對奔滑，內(nèi)心奔潰。百度半天都沒有找到有用的方案顺少。
下面就來說下Ant Design 圖標在vuecli3以上版本的使用方法
1.在腳手架中引入Ant Design
2.在main.js文件中寫入：
import Antd from 'ant-design-vue'
import 'ant-design-vue/dist/antd.css'
3.在需要使用的頁面引入對應的圖標
舉個例子朋其，我要在home.vue里面使用
圖片.png
步驟如下：
import HomeOutlined from '@ant-design/icons-vue/HomeOutlined'
export default defineComponent({
name: "Home",
components:{
HomeOutlined
}
}）
在頁面使用：<home-outlined></home-outlined>就可以了。
