基于Vue三大互联网企业级开箱即用中后台解决方案对比字节跳动Arco Design Pro,蚂蚁集团Ant Design Pro和腾讯TDesign Starter

Ant Design Pro 是基于 Ant Design 和 umi 的封装的一整套企业级中后台前端/设计解决方案，致力于在设计规范和基础组件的基础上，继续向上构建，提炼出典型模板/业务组件/配套设计资源，进一步提升企业级中后台产品设计研发过程中的『用户』和『设计者』的体验。随着『设计者』的不断反馈，我们将持续迭代，逐步沉淀和总结出更多设计模式和相应的代码实现，阐述中后台产品模板/组件/业务场景

天天打码

7604人浏览 · 2022-10-10 15:42:55

天天打码 · 2022-10-10 15:42:55 发布

基于Vue中后台解决方案越来越多开源了，随着各大互联网企业的Vue UI框架开源和普及后，都又有新的中后台解决方案也开源，方便开发者使用了。下面来作一个主观和客观的对比一下，字节跳动Arco Pro，蚂蚁集团Ant Design Pro，腾讯集团TDesign Starter三大开源中后台解决方案。

一，从star受欢迎度：
蚂蚁集团Ant Design Pro占绝对优势，可能因为是出来早，体量大，后面二个出来比较晚。
在这里插入图片描述

二，从兼容Ract,Vue框架来看：
字节跳动Arco Pro，蚂蚁集团Ant Design Pro，腾讯集团TDesign Starter三大开源中后台都支持React和Vue

框架	支持React	支持Vue	TypeScript
蚂蚁集团Ant Design Pro	支持	Vue2	React +TypeScript/ Vue2 + JavaScript
字节跳动Arco Pro	支持	Vue3	React+TypeScript / Vue3 + TypeScript
腾讯集团TDesign Starter	支持	Vue2/Vue3	React+ JavaScript / Vue2 + JavaScript / Vue3 + TypeScript

三，者的介绍和技术栈

Ant Design Pro
Ant Design Pro 是基于 Ant Design 和 umi 的封装的一整套企业级中后台前端/设计解决方案，致力于在设计规范和基础组件的基础上，继续向上构建，提炼出典型模板/业务组件/配套设计资源，进一步提升企业级中后台产品设计研发过程中的『用户』和『设计者』的体验。随着『设计者』的不断反馈，我们将持续迭代，逐步沉淀和总结出更多设计模式和相应的代码实现，阐述中后台产品模板/组件/业务场景的最佳实践，也十分期待你的参与和共建。
特点：
TypeScript: 应用程序级 JavaScript 的语言
📜 区块: 通过区块模板快速构建页面
💎 优雅美观：基于 Ant Design 体系精心设计
📐 常见设计模式：提炼自中后台应用的典型页面和场景
🚀 最新技术栈：使用 React/umi/dva/antd 等前端前沿技术开发
📱 响应式：针对不同屏幕大小设计
🎨 主题：可配置的主题满足多样化的品牌诉求
🌐 国际化：内建业界通用的国际化方案
⚙️ 最佳实践：良好的工程实践助您持续产出高质量代码
🔢 Mock 数据：实用的本地数据调试方案
✅ UI 测试：自动化测试保障前端产品质量

截图：
在这里插入图片描述

Arco Design Pro
基于 Arco Design React/Vue 组件库的开箱即用的中后台前端解决方案。Admin 中后台管理页面，创新的多架构方案。
特点：

TypeScript - 代码完全使用 TypeScript 书写
Arco Design - 由 ArcoDesign React 组件库强力驱动
Templates - 16+ 页面模版，覆盖表格、列表、表单、工作台、可视化等场景。
Themes - 基于「风格配置平台」丰富的主题市场，让你的项目千变万化。
Dark Theme - 一键丝滑切换暗黑风格
Mock - 内置 API 模拟方案
Flexible - 灵活的多架构方案，支持 next.js / vite / cra 等开发框架
I18n - 内置国际化多语言解决方案
Config - 灵活配置页面配色、布局等

演示地址：https://www.uihtm.com/vue/18838.html
截图：
在这里插入图片描述

TDesign Starter
TDesign Vue Starter 是一个基于 tdesign-vue，使用 Vue2、Vite开发，可进行个性化主题配置，旨在提供项目开箱即用的、配置式的中后台项目。

内置多种常用的中后台页面
完善的目录结构
完善的代码规范配置
支持暗黑模式
自定义主题颜色
多种空间布局
内置 Mock 数据方案

演示：https://www.uihtm.com/vue/18820.html
截图：
在这里插入图片描述
四，使用难度及Bug对比
从上手安装和框架使用上来对比，Ant Design Pro是基于蚂蚁的umi框架来构建的有很多配置需要先学习umi，运行开发构建比较慢，组件太多，上手熟悉难度大。而TDesign Starter和Arco Design Pro都是vite要构建上手比较快，内部组件和框架比较清晰适应中小企业使用。Bug方面，TDesign Starter和Arco Design Pro都是后面出来，bug比较少，Ant Design Pro有小bug。

五，维护升级
Ant Design Pro,TDesign Starter,Arco Design Pro 三者升级更新都比较快，由大企业维护。

总结：个人从设计UI上来说比较喜欢字节跳动Arco Design Pro 比较小清新，在技术栈方面ts+vue3+vite也是主流框架，容易上手和长期维护。

最后附上github地址：
Arco Design Pro ：https://github.com/arco-design/arco-design-pro-vue
Ant Design Pro(Vue)：https://github.com/vueComponent/ant-design-vue-pro
TDesign Starter：https://github.com/Tencent/tdesign-vue-next-starter