Vue3 常用組件庫推薦

Vue?作為一款深受廣大群眾喜歡的前端框架,擁有眾多優(yōu)秀的開源 UI 組件庫,這里整理了一下供大家參考。
這幾套框架主要用于后臺管理系統(tǒng)和移動端的制作,方便開發(fā)者快速開發(fā)。
一、PC 端 UI 庫
1.1 Element Plus
官網(wǎng)地址:https://element-plus.org/zh-CN/
Github: https://github.com/element-plus/element-plus
Element-plus 基于 Vue 3,面向設(shè)計(jì)師和開發(fā)者的組件庫。

1.2 Ant-design-vue
官網(wǎng)地址:https://antdv.com/
Github: https://github.com/vueComponent/ant-design-vue
ant-design-vue 是 Ant Design 的 Vue 實(shí)現(xiàn),開發(fā)和服務(wù)于企業(yè)級后臺產(chǎn)品。

1.3 Vuetify
官網(wǎng)地址:https://vuetifyjs.com/
Github: https://github.com/vuetifyjs/vuetify
Vuetify 是一個(gè)純手工精心打造的 Material 樣式的 Vue UI 組件庫。 不需要任何設(shè)計(jì)技能 — 創(chuàng)建嘆為觀止的應(yīng)用程序所需的一切都觸手可及。一套完整的開發(fā)對接文檔,易上手。
Vuetify 是世界上最流行的 Vue.js 框架,用于構(gòu)建功能豐富、快速的應(yīng)用程序。


1.4?Vant 4.0
官網(wǎng)地址:https://vant-ui.github.io/vant/
Github: https://github.com/vant-ui/vant
Vant 是一個(gè)輕量、可靠的移動端組件庫,于 2017 年開源。
目前 Vant 官方提供了?Vue 2 版本、Vue 3 版本和微信小程序版本,并由社區(qū)團(tuán)隊(duì)維護(hù)?React 版本和支付寶小程序版本。

1.5 Naive UI
官網(wǎng)地址:https://www.naiveui.com/
Github(11k):https://github.com/tusen-ai/naive-ui
Quasar 構(gòu)建高性能的 VueJS 用戶界面,開箱即用,支持桌面和移動瀏覽器(包括 iOS Safari?。?/p>
1.5?arco.design
字節(jié)跳動企業(yè)級產(chǎn)品設(shè)計(jì)系統(tǒng),支持React和Vue雙版本
官方地址:https://arco.design/
ArcoDesign 基于字節(jié)跳動公司內(nèi)部的 Byte Design 升級而來,在打磨了近 3 年之后,通過字節(jié)內(nèi)部大量業(yè)務(wù)沉淀和驗(yàn)證,在由掘金舉辦的《稀土開發(fā)者大會2021》上開源了,這不僅僅是一款 UI 組件庫,而是一個(gè)能力全面的企業(yè)級產(chǎn)品設(shè)計(jì)系統(tǒng)。
ArcoDesign 主要解決在打造中后臺應(yīng)用時(shí),讓產(chǎn)品設(shè)計(jì)和開發(fā)無縫連接,提高質(zhì)量和效率。目前 ArcoDesign 主要服務(wù)于字節(jié)跳動旗下中后臺產(chǎn)品的體驗(yàn)設(shè)計(jì)和技術(shù)實(shí)現(xiàn),主要由 UED 設(shè)計(jì)和開發(fā)同學(xué)共同構(gòu)建及維護(hù)。

1.6 TDesign
騰訊業(yè)務(wù)團(tuán)隊(duì)在服務(wù)業(yè)務(wù)過程中沉淀的一套企業(yè)級設(shè)計(jì)體系
官方地址:https://tdesign.tencent.com/
開發(fā)文檔:https://tdesign.tencent.com/vue-next/overview

1.7 DevUI
華為基于 Vue3 和 DevUI 設(shè)計(jì)的 UI 組件
官方地址:https://vue-devui.github.io/

1.8 vuestic-ui
Vue 3 的免費(fèi)和開源 UI 庫 ,UI非常好看,并且有可用后臺管理界面。
官方地址:https://vuestic.dev/
Vuestic UI 是一套由 Epicmax 團(tuán)隊(duì)開發(fā)的一套基于 Vue.js 的 web 開發(fā)組件庫,最近更新發(fā)布了 Vue3 版本,希望用 Vue .js 的專業(yè)知識以最佳方式構(gòu)建一個(gè)可用性強(qiáng)且全面的開源工具。Vuestic UI 在發(fā)布后不久,便成為使用 Vue 構(gòu)建的最受歡迎的組件庫之一。

二、移動端 UI 庫
2.1 Vant
Vant 是一個(gè)輕量、可靠的移動端組件庫。
官方地址:https://vant-contrib.gitee.io/vant/#/zh-CN/
Github:https://github.com/youzan/vant
有贊團(tuán)隊(duì)開源的 Vant 3 移動端 UI 組件庫,不僅已全面支持 Vue 3 而且還支持微信小程序和支付寶小程序。可以說移動端 UI 組件庫王者。Vant 對內(nèi)承載了有贊所有核心業(yè)務(wù),對外服務(wù)十多萬開發(fā)者,是業(yè)界主流的移動端組件庫之一。

2.2 NutUI
NutUI 是京東樣式風(fēng)格的 Vue 移動端組件庫,開發(fā)和服務(wù)于移動 Web 界面的企業(yè)級產(chǎn)品。
官方地址:https://nutui.jd.com/#/

2.3?nutui-bingo
由京東 NutUI 前端團(tuán)隊(duì)出品的一款基于 NutUI + Vue 3 的抽獎(jiǎng)組件庫,用于快速開發(fā)營銷活動和小游戲場景的抽獎(jiǎng)玩法。
官方地址:https://nutui.jd.com/bingo/#/

抽獎(jiǎng)組件技術(shù)特性
一共包含 12 種抽獎(jiǎng)組件
UI 設(shè)計(jì)基于京東 APP 10.0 視覺規(guī)范
官網(wǎng)提供詳盡的文檔和充足的代碼示例
基于 Vue 3.0,也支持 TypeScript,支持按需引入
便捷靈活的自定義設(shè)置
覆蓋12種常見的抽獎(jiǎng)組件
TurnTable 大轉(zhuǎn)盤抽獎(jiǎng)
Marquee 跑馬燈抽獎(jiǎng)
SquareNine 九宮格抽獎(jiǎng)
ScratchCard 刮刮卡抽獎(jiǎng)
GiftBox 神秘大禮盒
LottoRoll 搖獎(jiǎng)機(jī)
Hiteggs 砸金蛋
GiftRain 紅包雨
LuckShake 搖一搖
DollMachine 娃娃機(jī)
ShakeDice 搖骰子
GuessGift 你藏我猜
2.4 Varlet
Material 風(fēng)格移動端組件庫 ,文檔非常齊全。被尤雨溪推薦了,值得關(guān)注。
官方地址:https://varlet.gitee.io/varlet-ui/#/zh-CN/home

2.5 uview-plus
uview-plus3.0是基于uView2.x修改的vue3版本
官方地址:https://uiadmin.net/uview-plus/

2.6 Cube UI?
滴滴團(tuán)隊(duì)開源的 Cube UI 移動端 Vue UI 組件庫,輕巧趁手。
官網(wǎng):https://didi.github.io/cube-ui/#/zh-CN
Github:https://github.com/didi/cube-ui
Cube UI 質(zhì)量可靠,由滴滴內(nèi)部組件庫精簡提煉而來,經(jīng)歷了業(yè)務(wù)一年多的考驗(yàn),并且每個(gè)組件都有充分單元測試,為后續(xù)集成提供保障。體驗(yàn)極致,以迅速響應(yīng)、動畫流暢、接近原生為目標(biāo),在交互體驗(yàn)方面追求極致。

你還知道哪些優(yōu)秀的 Vue3 UI 框架,在評論區(qū)留言,帶上官網(wǎng)地址,好東西就要分享給大家。
?? 看完兩件事
如果你覺得這篇內(nèi)容對你挺有啟發(fā),我想邀請你幫我兩個(gè)小忙:
點(diǎn)個(gè)「贊」或者「轉(zhuǎn)發(fā)評論」,讓更多的人也能看到這篇內(nèi)容(喜歡不點(diǎn)贊,都是耍流氓 -_-)
關(guān)注公眾號「前端知識分享喵」,不定時(shí)更新前端技術(shù)分享,
公眾號后臺回復(fù)「電子書」即可免費(fèi)獲取精選的前端電子書。
添加 MagnumHou 微信,可以獲取 up 主有的大機(jī)構(gòu)的學(xué)習(xí)視頻哦