分享一些 Vue 實(shí)用且常用的開發(fā)工具庫
Vue3
雖然 Vue2 很多項(xiàng)目在用,但是官方已經(jīng)宣布不在維護(hù) Vue2,所以新項(xiàng)目肯定首選 Vue3 來進(jìn)行開發(fā),組合式 API 開發(fā)起來比選項(xiàng)式 API 方便多了,而且 Vue3 的響應(yīng)式實(shí)現(xiàn)也更加合理,對(duì) typescript 的支持也更好,打包體積也更小,模板編譯加入了靜態(tài)節(jié)點(diǎn)提升的優(yōu)化
圖片
Nuxt
官方出品的 SSR 框架,絕對(duì)是首選
圖片
Vite
現(xiàn)在 Vite 這個(gè)構(gòu)建工具有多火不用我說了吧?相比于 Webpack,Vite 比較輕量,且開發(fā)階段構(gòu)建超級(jí)快,除非舊項(xiàng)目依賴 Webpack,不然新項(xiàng)目首選 Vite
圖片
PNPM
在包管理器的選擇上,首選 PNPM,相比于 NPM,它能解決很多問題,例如幽靈依賴、安裝速度快、節(jié)省空間、天然支持 Monorepo
圖片
Pinia
相比于老牌狀態(tài)管理 Vuex,Pinia更加小巧,使用起來也更加簡單,對(duì) Typescript 的支持也更好,并且所見即所得讓開發(fā)者開發(fā)起來更加舒適
Pinia 也官方支持了持久化緩存的措施,非常方便,拓展性也更強(qiáng)
圖片
Http 請(qǐng)求庫
Axios 無疑是當(dāng)今 Http 請(qǐng)求庫的王者,無論是 Node 還是瀏覽器端,它都能很好地支持,且配置起來比較靈活,拓展性非常強(qiáng),難怪下載量一直居高不下
圖片
圖片
UI 庫
ElementUI & Antdv
其實(shí) ElementUI 和 Antdv 這兩個(gè)組件庫都能滿足大部分的 PC 端的網(wǎng)頁開發(fā),至于選擇哪個(gè)就看個(gè)人審美了,這兩個(gè)依舊占據(jù)著 Vue PC 端 UI 庫的前二
圖片
圖片
Vuetify
Vuetify 中的每個(gè)組件都是在 Google Material Design 規(guī)范下制開發(fā)出來的,并附帶數(shù)百個(gè)適合任何風(fēng)格或設(shè)計(jì)的自定義選項(xiàng);
Vuetify 支持多平臺(tái)適配
圖片
Vant
Vant 是 Vue 移動(dòng)端開發(fā)選擇最多的 UI 庫,且非常輕量~
圖片
表格組件
表格組件其實(shí)很多 UI 組件庫都具備,但是畢竟他們精力有限,所以很多表格組件的質(zhì)量都比較一般
Vxe-table
老牌表格組件庫了,功能超級(jí)多,沒有做不到的,只有你想不到的
圖片
vTable
字節(jié)開源的表格組件庫,底層用 Canvas 實(shí)現(xiàn)的,天然支持虛擬滾動(dòng),性能不錯(cuò)
圖片
Surely Vue
Antdv 自己研發(fā)的一款表格組件庫,但是不開源需要收費(fèi),它的虛擬滾動(dòng)做的很不錯(cuò),跟其他表格都不一樣
圖片
Hooks 庫
首選 Vueuse ,由 Vue 團(tuán)隊(duì)核心成員 Anthony Fu 開發(fā),功能超級(jí)多,基本能滿足你的開發(fā)需求
圖片
拖拽庫
其實(shí) vue 的拖拽庫已經(jīng)斷代很久了,上一個(gè)很火的是 vue-draggable,但是這個(gè)庫很久沒更新了,且只對(duì) Vue2 支持的比較好
圖片
所以現(xiàn)在推薦 vue3-dnd 這個(gè)庫,對(duì) Vue3 支持比較好,且具備基本的拖拉拽功能
圖片
I18N
在做國際化 I18N 的時(shí)候可以借助 vue-i18n 這個(gè)包來完成,使用起來很方便
圖片
站點(diǎn)生成器
Vitepress 借助 Vue3 和 Vite,能提供更好的開發(fā)體驗(yàn)和生產(chǎn)性能,以及更精美的默認(rèn)主題
圖片