由于最近項(xiàng)目上線首頁加載問題，從各方面進(jìn)行優(yōu)化減少體積，包括icon的按需導(dǎo)入，借此記錄一下

1.首先需要創(chuàng)建一個(gè)icon.js，我是直接在src的utils中創(chuàng)建的(可以根據(jù)自己需要，在對應(yīng)路徑創(chuàng)建)

icon.js

......

// 此處寫你項(xiàng)目所需圖標(biāo)名稱，一般fill對應(yīng)的是你所用其他控件內(nèi)置的圖標(biāo)如日歷，outline一般對應(yīng)你a-icon對應(yīng)的圖標(biāo)，不過不能一概而論，具體還是得根據(jù)實(shí)際情況

export { default as InfoCircleOutline } from '@ant-design/icons/lib/outline/InfoCircleOutline'

export { default as InfoCircleFill } from '@ant-design/icons/lib/fill/InfoCircleFill'

.......

// 最后留一行換行，好像說是如果不留會影響編譯之類(ps：此操作借鑒其他博客，當(dāng)然也可以不留一行嘗試一下編譯)

2.然后在vue.config.js中配置，此處是vue-cli3的，所以在這里配置，不同版本的得在對應(yīng)的webpack配置文件里配置

vue.config.js

......

configureWebpack: {

resolve: {

alias: {

'@ant-design/icons/lib/dist$': path.resolve(__dirname,'./src/utils/icon.js') // 自建的文件的相對路徑

}

}

}

......

至此，icon按需導(dǎo)入已完成，如果有什么問題，歡迎留言討論，共同學(xué)習(xí)

總結(jié)

以上是生活随笔為你收集整理的ant文件放在ps的哪里_ant design vue按需导入icons的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。