當前位置: 妍妍網 > 碼農

2024 Vue 最全的生態工具組合推薦指南

2024-06-24碼農

前言

大家好,我是林三心,用最通俗易懂的話講最難的知識點是我的座右銘,基礎是進階的前提是我的初心~

Vue3

雖然 Vue2 很多計畫在用,但是官方已經宣布不在維護 Vue2,所以新計畫肯定首選 Vue3 來進行開發,組合式 API 開發起來比選項式 API 方便多了,而且 Vue3 的響應式實作也更加合理,對 typescript 的支持也更好,打包體積也更小,樣版編譯加入了靜態節點提升的最佳化

Nuxt

官方出品的 SSR 框架,絕對是首選

Vite

現在 Vite 這個構建工具有多火不用我說了吧?相比於 Webpack,Vite 比較輕量,且開發階段構建超級快,除非舊計畫依賴 Webpack,不然新計畫首選 Vite

PNPM

在包管理器的選擇上,首選 PNPM,相比於 NPM,它能解決很多問題,例如幽靈依賴、安裝速度快、節省空間、天然支持 Monorepo

Pinia

相比於老牌狀態管理 Vuex,Pinia更加小巧,使用起來也更加簡單,對 Typescript 的支持也更好,並且所見即所得讓開發者開發起來更加舒適

Pinia 也官方支持了持久化緩存的措施,非常方便,拓展性也更強

Http 請求庫

Axios 無疑是當今 Http 請求庫的王者,無論是 Node 還是瀏覽器端,它都能很好地支持,且配置起來比較靈活,拓展性非常強,難怪下載量一直居高不下

UI 庫

ElementUI & Antdv

其實 ElementUI 和 Antdv 這兩個元件庫都能滿足大部份的 PC 端的網頁開發,至於選擇哪個就看個人審美了,這兩個依舊占據著 Vue PC 端 UI 庫的前二

Vuetify

Vuetify 中的每個元件都是在 Google Material Design 規範下制開發出來的,並附帶數百個適合任何風格或設計的自訂選項;

Vuetify 支持多平台適配

Vant

Vant 是 Vue 移動端開發選擇最多的 UI 庫,且非常輕量~

表格元件

表格元件其實很多 UI 元件庫都具備,但是畢竟他們精力有限,所以很多表格元件的品質都比較一般

Vxe-table

老牌表格元件庫了,功能超級多,沒有做不到的,只有你想不到的

vTable

字節開源的表格元件庫,底層用 Canvas 實作的,天然支持虛擬捲動,效能不錯

Surely Vue

Antdv 自己研發的一款表格元件庫,但是不開源需要收費,它的虛擬捲動做的很不錯,跟其他表格都不一樣

Hooks 庫

首選 Vueuse ,由 Vue 團隊核心成員 Anthony Fu 開發,功能超級多,基本能滿足你的開發需求

拖拽庫

其實 vue 的拖拽庫已經斷代很久了,上一個很火的是 vue-draggable,但是這個庫很久沒更新了,且只對 Vue2 支持的比較好

所以現在推薦 vue3-dnd 這個庫,對 Vue3 支持比較好,且具備基本的拖拉拽功能

I18N

在做國際化 I18N 的時候可以借助 vue-i18n 這個包來完成,使用起來很方便

站點生成器

Vitepress 借助 Vue3 和 Vite,能提供更好的開發體驗和生產效能,以及更精美的預設主題

我是林三心

  • 一個待過 小型toG型外包公司、大型外包公司、小公司、潛力型創業公司、大公司 的作死型前端選手;

  • 一個偏前端的全幹工程師;

  • 一個不正經的金塊作者;

  • 逗比的B站up主;

  • 不帥的小紅書博主;

  • 喜歡打鐵的籃球菜鳥;

  • 喜歡歷史的乏味少年;

  • 喜歡rap的五音不全弱雞如果你想一起學習前端,一起摸魚,一起研究簡歷最佳化,一起研究面試進步,一起交流歷史音樂籃球rap,可以來俺的摸魚學習群哈哈,點這個,有7000多名前端小夥伴在等著一起學習哦 -->