2018 年你須要知道的 Vue.js 組件庫，完善你的應用開發

 

 2018 年來臨之際，繼最熱的 React 組件庫和 Angular 組件庫以後，這裏有 11 個流行和實用的 Vue.js 組件庫完善你的下一個用 Vue.JS 編寫 UI 界面的應用程序。

與 React 和 Angular 不一樣的是，Vue.js 是 Evan You 經過衆包（ crowd-sourcing）來維護的一個開源項目。 這也是 Vue.js 最好的一部分，由於會鼓勵你寫出更好的代碼和更好的文檔。
Vue.js 項目在獲得 8 萬多個 star 的時候，Adobe，Gitlab 和 其餘公司也都使用了它，它的受歡迎程度超過了想象，並且人氣彷佛還在繼續增加。

Vue 成功的很大一部分在於其組件。使用其組件你能夠獨立思考 UI 的每一個片斷，鼓勵可重用性和模塊化，並幫助保持 UI 的一致性。全部的 Vue 組件也都是 Vue 實例，因此接受相同的選項對象並提供相同的生命週期鉤子函數。

組件也能夠與 Bit 共享來鏈接像 Git，Yarn 和 NPM 這樣的工具，以造成存儲庫之間的無摩擦代碼共享體驗。 也能夠將任何 Git 存儲庫中的組件分離出來，並將其快速分享給動態和可固定的組件集合。 從那裏，組件能夠被單獨發現並打包給管理者一塊兒使用，或者在任何存儲庫中進行進一步修改。
1. Vuetify

Vuetifyjs 根據材料設計規格提供 UI 佈局。 V 1.0 Alpha 版本提供了超過 80個 reusbale 組件，其中包含一個易於記憶的語義設計，它基於名稱簡單明瞭 type-as-you 的類型屬性。在GitHub 上有超過 7K 的 star。

2. Vue Material

Vue Material 是一個實現 Google’s material design 的 Vue 組件庫，大約有 5K 的 star，它提供了適合全部現代 Web 瀏覽器的內置動態主題的組件，它的 API 也簡單明瞭。

3. Keen UI

使用 Vue 編寫的基本輕量級 UI 組件庫，並受 Material Design 的啓發，雖然受 Material UI 規範的啓發，但 Keen-UI 並非真正的 Material UI 庫。它不是一個CSS框架，不包括網格系統或排版風格，但有須要Javascript 的組件。

4. Element

用於 Web 的 Vue.js 2.0 UI 工具包，這個使用普遍流行的 Vue 2.0 網絡工具包提供了豐富的可定製組件的選擇。 並且還提供了中文文檔，擁有一套完整的生態系統，爲下一個 Vue UI 庫提供了強有力的選擇。

5. Buefy

Buefy 基於 Bulma 和 Vue.js 的輕量級UI組件，它提供了即裝即用的輕量級組件。雖然組件選擇有限，可是值得你去嘗試。

6. Bootstrap-Vue

使用 Vue.js 和世界上最流行的前端 CSS 庫—Bootstrap V4 在 Web 上構建響應式，移動優先項目。
Bootstrap-Vue 爲 Vue.js 2.4+ 提供了 Bootstrap V4 組件和最全面的網格系統的實現，它具備普遍的自動化 WAI-ARIA 輔助功能標記。

7. AT-UI

AT-UI 是一個模塊化的前端 UI 框架，開發基於Vue.js 的快速和強大的 Web 界面。專門爲桌面應用程序構建，AT-UI 提供了一套 npm + webpack + babel 前端開發工做流程。全英文的文檔對用戶來講多是具備有挑戰性的，但它提供了一個體面的乾淨整潔的 UI 組件。

8. Fish-UI

Fish-UI 是 webpack 和 ES2015 協同工做的工具包。 幾乎沒有文檔，這個庫有超過 35 個組件可供選擇和有一個乾淨整潔的界面。

9.Quasar

這個流行的框架是包括用 Vue 構建的幾十個 Vue.js 組件組成，爲響應式 Web 應用程序和混合移動應用程序提供的豐富功能選項。組件是做爲 Web 組件編寫的，因此它們嵌入了 HTML，CSS 和 Javascript 代碼，只需在頁面和佈局模板中標註一個 HTML 標記便可使用。

10. Muse UI

Muse-UI 是 Vue.js 2.0 的一個 Material Design UI 庫。 這個組件庫是中文文檔，對於尋求 Vue.js Material Design 的人來講，這些組件的功能是很強大的。

11. Vux

Vux 是一個受 WeChat 的 weUI 的啓發開發的廣受歡迎的移動應用組件庫。Vux 基於 webpack+vue-loader+vux 能夠快速開發移動端頁面，配合 vux-loader 方便你在 WeUI 的基礎上定製須要的樣式。 vux-loader 保證了組件按需使用，所以不用擔憂最終打包了整個 vux 的組件庫代碼。

其餘組件：
在組件和庫中，我的組件能夠在 awesome-vue 項目中找到 。爲了保持 UI 的一致性，避免重複，避免將整個庫添加到項目中，還能夠將 Bit 添加到任何庫，以便輕鬆快速地使用 NPM / Yarn 安裝我的組件。
不管你選擇一個庫仍是使用本身的設計組件，Vue.js 彷佛都是你下一個應用程序的最好選擇，它提供了一個輕鬆，輕量級且多功能的框架。

更多免費學習資料，加羣434623999