【unibest】 uniapp + vue3 模板 UI 框架选型

背景

unibest 作为最好的 uniapp 开发模板，那 UI 框架 的选择也是要仔细斟酌的。

unibest 作为 uniapp + vue3 + ts 的项目，自然也要选择满足 vue3 的 UI库，所以像 vue2 时代的 uview 就不考虑在内了。但是在 uview 的基础上衍生出来的支持 vue3 的 uview 系 的 ui框架 还有不少，而且热度很高。

再来说说官方维护的 uni-ui，支持全端，而且有类型提示，目前已经内置到 unibest 了，如果用户确实用不到里面的组件也可以删除，减少包体积。

TIPS: uni-ui 本身是 js 开发的，但是官方提供了完备的类型提示( by @uni-helper/uni-ui-types)所以看起来就像是 ts 开发的一样，开发体验很好。所有的组件都有提示，很方便，很贴心。

UI 框架

经过搜寻了一番，目前参加对比的 UI 框架有：

• uview-plus (uveiw 系) - 文档地址
• uv-ui (uveiw 系) - 文档地址
• Wot Design Uni (wot 系) - 文档地址
• TuniaoUI （图鸟系） - 文档地址

还有 2 个 UI 框架也很优秀，但是部分组件开源免费，部分组件收费：

• ThorUI 文档链接
• FirstUI 文档链接

温馨提示：

1. 收费没有对错，开源作者也要恰饭，需要有收入，光为爱发电可能半路夭折，或者质量很差。只要做得好，别人愿意买，提供优质的服务，也是极好的。PS：人家不仅提供付费组件，还会提供很多模板，比如登录页面， 100元 一套，性价比还是不错的。

2.当然了 unibest 作为开源库，自然会选择免费的 UI 框架，下面我们就来对比一下下~

UI 框架对比

1. 开源热度

截止到 2024-02-20 发表文章时的数据:

UI 框架	uview-plus	uv-ui	Wot	TuniaoUI
github stars	291	358	226	141
gitee stars	126	555	35	-
github forks	73	16	31	12
gitee forks	5	40	6	-

其实到这里就一决高下了，uview 系的 2 位胜出，而且 uv-ui 以小小优势胜过 uview-plus。再经过人眼观察和对比两者官网的组件，最终我们选定 uv-ui 作为我们的 UI 框架。

源码仓库地址展示如下，_纯粹为了方便大家查阅_ （虽然大概率你们也不会去访问，/手动狗头）

UI 框架	github repo url	gitee repo url
uview-plus	https://github.com/ijry/uview-plus	https://gitee.com/uiadmin/uview-plus
uv-ui	https://github.com/climblee/uv-ui	https://gitee.com/climblee/uv-ui
Wot	https://github.com/Moonofweisheng/wot-design-uni	https://gitee.com/wot-design-uni/wot-design-uni
TuniaoUI	https://github.com/tuniaoTech/tuniaoui-rc-vue3-uniapp	-

接着奏乐接着舞，我们继续正文 ^_^

2.多端支持情况

UI 框架	uview-plus	uv-ui	Wot	TuniaoUI
h5	✅	✅	✅	✅
app(ios)	✅	✅	✅	✅
app(android)	✅	✅	✅	✅
微信小程序	✅	✅	✅	✅
QQ 小程序	✅	✅	❌	❌
百度小程序	✅	✅	❌	❌
支付宝小程序	✅	✅	❌	✅
头条小程序	✅	✅	❌	❌

3.组件数量

UI 框架	uview-plus	uv-ui	Wot	TuniaoUI
总数	67	67	62	55
基础组件	11	8	8	5
表单组件	17	16	20	14
数据组件	4	13	18	4
反馈组件	10	8	16	8
布局组件	9	7	-	8
导航组件	8	8	7	5
其他组件	8	7	-	5
内容组件	-	-	-	6

4.ts 支持情况

很不幸，上面几个都不支持 ts，没有类型提示，只能对着它们的文档撸代码。

总结

很高兴我们已经为宇宙最强 uniapp 开发模板 unibest 选好了 UI 组件库，uv-ui 是最终的幸运儿。为此我特意去 uv-ui 官网里面捐赠了一杯咖啡钱给作者，开源不易，要支持一下。

其实另外几个 UI框架 我也捐了几块钱，聊表心意，表示支持。

好文推荐

🔥2024 年最好用的 uniapp 开发模板，近一个月 star 数飙升！🔥 - 点赞数：274， 收藏数：581

本文由 mdnice 多平台发布