官方出品！一款企业级中后台前端脚手架！

大家好，我是 Java陈序员。

还在从零搭建中后台管理系统？页面布局、权限路由、表格表单、异常页面统统要手写，耗时又费力，还容易出现样式不统一、架构不规范的问题。

今天，给大家介绍一款企业级中后台前端脚手架，蚂蚁集团官方出品！

关注微信公众号：【Java陈序员】，获取开源项目分享、AI副业分享、超200本经典计算机电子书籍等。

项目介绍

ant-design-pro —— 蚂蚁集团基于 React、Umi、Ant Design 打造的企业级中后台前端脚手架，提供完整的布局、权限、路由、组件模板功能，适合快速开发管理系统。

功能特色：

• 内置完整中台页面：仪表盘、各类表单、列表、详情页、异常页、个人中心等页面，直接复用，无需从零搭建页面骨架
• 多种布局与主题：提供侧边栏、顶部、混合三种经典布局，支持暗黑模式、主题色自定义、布局配置记忆
• 完善的权限管理：内置 RBAC 权限体系，支持路由级、页面级、按钮级细粒度权限控制，以及动态生成菜单、权限拦截、未授权跳转
• 工程化开发体验：支持全量 TypeScript 类型完备、统一请求封装、全局异常处理等功能，内置 Mock 接口，本地前端可独立开发

技术栈：TypeScript、React 19、Umi Max 4、Ant Design 6、utoopack、Tailwind CSS v4

快速上手

1、克隆或下载项目源码

git clone --depth=1 https://github.com/ant-design/ant-design-pro.git

2、进入项目目录并安装依赖

cd ant-design-pro

npm install

3、运行启动

npm start

4、启动成功后，浏览器访问

http://localhost:8000/

默认用户名和密码：admin/ant.design.

5、打包构建

npm run build

6、项目默认包含所有区块，如果需要的是一个最小化的版本，运行：

npm run simple

这将会：

• 删除多余的页面目录（dashboard、form、list/*、profile、result、exception、account 等）
• 删除多余的 mock 文件
• 替换路由为简单版本
• 从 package.json 中移除多余的依赖

功能体验

• 仪表盘

• 表单

• 列表

• 详情

• 风格设置

• AI 助手

• 暗黑模式

可以说，ant-design-pro 具备成熟的技术架构，提供丰富的页面模板、完善的权限体系和极佳的开发体验。不管是个人开发者快速接单开发，还是企业团队搭建统一中台项目架构，它都是一个可供选择的方案，告别重复造轮子。快去试试吧~

项目地址：https://github.com/ant-design/ant-design-pro

最后

推荐的开源项目已经收录到 GitHub 项目，欢迎 Star：

https://github.com/chenyl8848/great-open-source-project

或者访问网站，进行在线浏览：

https://chencoding.top:8090/#/

我创建了一个开源项目交流群，方便大家在群里交流、讨论开源项目。

但是任何人在群里打任何广告，都会被 T 掉。

如果你对这个交流群感兴趣或者在使用开源项目中遇到问题，可以通过如下方式进群：

关注微信公众号：【Java陈序员】，回复【开源项目交流群】进群，或者通过公众号下方的菜单添加个人微信，并备注【开源项目交流群】，通过后拉你进群。

大家的点赞、收藏和评论都是对作者的支持，如文章对你有帮助还请点赞转发支持下，谢谢！

---