国内的前端组件库推荐

7 阅读2分钟

国内开源前端组件库覆盖 PC 中后台、移动端、跨端 / 跨框架等多个场景,以下按核心场景分类整理主流项目,附关键信息与适配方向:


一、PC 企业级中后台组件库

组件库所属团队技术栈核心特点协议
Ant Design蚂蚁集团React企业级设计体系,组件丰富,生态完善,适合复杂中后台MIT
Ant Design Vue蚂蚁集团(社区维护)Vue 3Ant Design 的 Vue 实现,设计统一,适配 Vue 生态MIT
Element Plus饿了么(阿里系)Vue 3轻量易用,文档友好,国内 Vue 中后台首选,生态成熟MIT
OpenTiny(TinyVue)华为云 OpenTiny 团队Vue 2/3跨端跨框架,100 + 组件,6 套主题,低代码适配MIT
ArcoDesign字节跳动React/Vue模块化设计,支持自定义主题,适配中后台与 ToB 场景MIT
TDesign腾讯React/Vue/ 小程序企业级设计体系,覆盖 PC / 移动端 / 小程序,工具链完整MIT

二、移动端专用组件库

组件库所属团队技术栈核心特点协议
Vant有赞Vue 2/3 / 小程序轻量高性能,电商场景适配,社区 React 版本完善MIT
NutUI京东Vue 2/3移动端友好,电商组件丰富,支持多端适配(H5 / 小程序)MIT
WeUI微信团队原生 JS微信视觉一致,轻量无框架依赖,适合微信 H5 开发MIT
Taro UI京东凹凸实验室Taro/Vue 3跨端适配(小程序 / H5/APP),组件轻量,性能优异MIT

三、跨框架 / 跨端组件库

  • DevUI(华为云):支持 Vue/React/Angular,面向企业中后台,设计简洁,组件灵活,MIT 协议。
  • Layui:轻量模块化 UI 框架,无框架依赖,适合快速开发后台管理系统,MIT 协议。

四、特色功能组件库(非全量 UI)

  • ECharts(百度):开源可视化图表库,支持多种图表类型,适配大数据可视化场景,Apache 2.0 协议。
  • wangEditor(个人团队):轻量富文本编辑器,无框架依赖,适合后台编辑 / 评论区,MIT 协议。
  • Vditor(个人团队):支持富文本 / Markdown / 思维导图,适配 Vue/React,MIT 协议。
  • Formily(阿里系):高性能表单解决方案,支持复杂表单逻辑,适配 React/Vue,MIT 协议。

五、低代码 / 微前端相关组件

  • LowCodeEngine(阿里):企业级低代码引擎,支持可视化拖拽、组件定制,MIT 协议。
  • qiankun(乾坤) (阿里):微前端框架,支持多技术栈子应用隔离与通信,MIT 协议。

选型参考

  1. 中后台 Vue 项目:优先 Element Plus 或 Ant Design Vue。
  2. 中后台 React 项目:优先 Ant Design 或 ArcoDesign。
  3. 移动端电商:优先 Vant 或 NutUI。
  4. 跨端 / 小程序:优先 TDesign 或 Taro UI。
  5. 轻量快速开发:优先 Layui 或 wangEditor。