高顏值移動(dòng)端UI組件庫(kù)，你知道幾個(gè)？
Vant
Vant 是有贊團(tuán)隊(duì)開源的一個(gè)輕量、可定制的移動(dòng)端組件庫(kù)，于 2017 年開源。目前 Vant 官方提供了 Vue 2 版本、Vue 3 版本和微信小程序版本，并由社區(qū)團(tuán)隊(duì)維護(hù) React 版本和支付寶小程序版本。
Vant 具有以下特性：
- 性能極佳，組件平均體積小于 1KB（min+gzip）
- 80+ 個(gè)高質(zhì)量組件，覆蓋移動(dòng)端主流場(chǎng)景
- 零外部依賴，不依賴三方 npm 包
- 使用 TypeScript 編寫，提供完整的類型定義
- 單元測(cè)試覆蓋率超過 90%，提供穩(wěn)定性保障
- 提供豐富的中英文文檔和組件示例
- 提供 Sketch 和 Axure 設(shè)計(jì)資源
- 支持 Vue 2、Vue 3 和微信小程序
- 支持 Nuxt 2、Nuxt 3，提供 Nuxt 的 Vant Module
- 支持主題定制，內(nèi)置 700+ 個(gè)主題變量
- 支持按需引入和 Tree Shaking
- 支持無障礙訪問（持續(xù)改進(jìn)中）
- 支持深色模式
- 支持服務(wù)器端渲染
- 支持國(guó)際化，內(nèi)置 30+ 種語言包
- 官網(wǎng)：https://vant-ui.github.io/vant/。
- Github：https://github.com/youzan/vant。
Ant Design Mobile
Ant Design 移動(dòng)端設(shè)計(jì)規(guī)范，一個(gè)基于 Preact/React/React Native 的 UI 組件庫(kù)。Ant Design 是 Ant Design 的移動(dòng)規(guī)范的 React 實(shí)現(xiàn)。
Ant Design Mobile 具有以下特點(diǎn)：
- 高性能：無需配置，即可擁有最佳的包體積大小和極致的性能
- 可定制：可以高效地對(duì)組件外觀進(jìn)行調(diào)整或創(chuàng)造自己的主題
- 原子化：每個(gè)組件的功能不多也不少，恰好就是你所需
- 流暢感：擁有流暢的手勢(shì)和細(xì)膩的動(dòng)畫，助力產(chǎn)品打造出極致體驗(yàn)
- 官網(wǎng)：https://mobile.ant.design/zh。
- Github：https://github.com/ant-design/ant-design-mobile。
NutUI
NutUI 是一個(gè)由京東零售團(tuán)隊(duì)開源的京東風(fēng)格的輕量級(jí)組件庫(kù)，支持移動(dòng)端 H5 和小程序開發(fā)。
NutUI 具有以下特性：
- 70+ 高質(zhì)量組件，覆蓋移動(dòng)端主流場(chǎng)景
- 支持一套代碼同時(shí)開發(fā) H5+多端小程序
- 基于京東APP 10.0 視覺規(guī)范
- 支持按需引用
- 詳盡的文檔和示例
- 支持 TypeScript
- 支持服務(wù)端渲染（測(cè)試階段）
- 支持組件級(jí)別定制主題，內(nèi)置 700+ 個(gè)變量
- 國(guó)際化支持，已支持英文，印尼語和繁體中文
- 單元測(cè)試覆蓋率超過 80%，保障穩(wěn)定性
- 提供 Sketch 設(shè)計(jì)資源
NutUI 提供了多個(gè)框架的版本組件：
- 官網(wǎng)：https://nutui.jd.com/。
- Github：https://github.com/jdf2e/nutui。
Varlet
Varlet 是一個(gè)基于 Vue3 開發(fā)的 Material 風(fēng)格移動(dòng)端組件庫(kù)，全面擁抱 Vue3 生態(tài)，由社區(qū)團(tuán)隊(duì)維護(hù)。
Varlet 具有以下特性：
- 提供 60+ 個(gè)高質(zhì)量通用組件
- 組件十分輕量
- 由國(guó)人開發(fā)，完善的中英文文檔和后勤保障
- 支持按需引入
- 支持主題定制
- 支持國(guó)際化
- 支持 webstorm 組件屬性高亮
- 支持 SSR
- 支持 Typescript
- 確保 90% 以上單元測(cè)試覆蓋率，提供穩(wěn)定性保證
- 支持暗黑模式
- 提供官方的 VSCode 插件
- 官網(wǎng)：https://varlet.gitee.io/varlet-ui/#/zh-CN/index。
- Github：https://github.com/varletjs/varlet。
Arco Design Mobile
Arco Design Mobile 是基于 Arco Design 設(shè)計(jì)系統(tǒng)、由字節(jié)跳動(dòng) UED-火山引擎 & 小說前端匠心打造、經(jīng)歷兩年多字節(jié)內(nèi)部打磨的移動(dòng)端組件庫(kù)。
Arco Design Mobile 提供了 50+ 基礎(chǔ)組件，覆蓋各類場(chǎng)景。借助 Arco 豐富的組件可以更好的搭建應(yīng)用，提高效率，在整個(gè)產(chǎn)品生產(chǎn)過程中創(chuàng)造更具凝聚力的可擴(kuò)展體驗(yàn)。
- 官網(wǎng)：https://arco.design/mobile/react。
- Github：https://github.com/arco-design/arco-design-mobile。
