vue3 開發(fā)利器2——unplugin-vue-components
基本上無害
發(fā)布于 云南 2023-04-30 · 3.5w瀏覽 2贊

距離上一篇拖了半年,終于把下接上了。


這玩意兒是干啥的??

Vue的按需組件自動導(dǎo)入。

特點:

?? 支持 Vue 2 和 Vue 3 的開箱即用。

? 同時支持 組件 和 自定義指令。

?? 支持 Vite、Webpack、Vue CLI、Rollup、esbuild 等,由?unplugin?驅(qū)動。

?? 樹狀結(jié)構(gòu),只注冊你使用的組件。

?? 文件夾名稱作為命名空間。

?? 完全支持 TypeScript。

?? 內(nèi)置常用UI庫的解析器

?? 與?unplugin-icons?完美合作。


安裝


設(shè)置?

寫在上圖?options?位置的配置項,具體可以有如下參數(shù):


dts?—— TypeScript 支持?

為了獲得 TypeScript 對自動導(dǎo)入組件的支持,Vue 3 有一個?PR,擴展了全局組件的接口。目前,Volar?已經(jīng)支持這種用法了。如果你正在使用Volar,你可以按以下方式修改配置來獲得支持。


types?—— 全局類型注冊?

一些庫可能會注冊一些全局組件,供你在任何地方使用(例如 Vue Router 提供了??和?)。由于它們是全局可用的,這個插件不需要導(dǎo)入它們。

然而,那些通常對 TypeScript 不友好,你可能需要手動注冊它們的類型。

因此 unplugin-vue-components 提供了一種只為全局組件注冊類型的方法。

所以?RouterLink?和?RouterView?將在?components.d.ts?中呈現(xiàn)。

默認情況下,unplugin-vue-components 會在工作空間中安裝支持的庫(例如?vue-router)時自動檢測。如果你想完全禁用它,你可以傳遞一個空數(shù)組給它:


總結(jié)?

以后都給我用這玩意兒寫項目,不準(zhǔn)每個頁面瘋狂地?import?了。

基本上無害
火星宛如雪花,從42號有軌電車車頂?shù)墓渭娖魃巷w落而下。
瀏覽 3.5w
2
相關(guān)推薦
最新評論
贊過的人 2
評論加載中...

暫無評論,快來評論吧!