在距离 v5 发布近五年后，Ant Design Pro v6 现已正式发布。

“五年间，前端世界发生了翻天覆地的变化——React 18/19 带来了并发渲染，antd 从 v4 升级到了 v6，构建工具从 webpack 演进到了 Turbopack，CSS-in-JS 和 Tailwind 成为主流。Ant Design Pro 也在持续演进，但作为一个脚手架项目，我们一直在思考：v6 到底应该带来什么？

答案不是更多功能，而是更现代、更精简、更贴近当下开发体验。

v6 做了两件事：全面拥抱最新技术栈，以及清理历史包袱。”

具体更新内容如下：

框架全面升级

React 19 + antd 6

v6 基于 React 19 和 antd 6 构建。React 19 带来的并发特性、Server Components 能力，antd 6 带来的设计系统更新、CSS 变量主题——这些在 v5 中只能梦想的东西，现在开箱即用。

Umi Max 4

从 umi 3 升级到 @umijs/max 4（Umi Max）。Umi Max 将常用插件打包为一站式方案——权限、国际化、数据流、请求——全部从 @umijs/max 统一导入，无需单独配置：

- import { useModel } from 'umi';
+ import { useModel, request, useAccess, getLocale, useIntl } from '@umijs/max';

Umi Max 4 默认使用 utoopack 构建（基于 Turbopack），开发体验显著提升。

ProComponents v3

从分散的 @ant-design/pro-table、@ant-design/pro-form、@ant-design/pro-layout 等多个包，统一为 @ant-design/pro-components v3。一个包解决所有中后台组件需求，版本对齐不再头疼。

样式体系重构

v5 的样式主要基于 Less，这是一个明智的早期选择，但随着社区发展，Less 的维护活跃度持续下降。v6 全面拥抱现代 CSS 方案：

• Tailwind CSS v4：原子化 CSS，布局和间距从此不再需要写自定义样式
• antd-style v4：CSS-in-JS 方案，直接消费 antd 设计令牌（Design Token），主题切换零成本
• CSS Modules：组件级样式隔离，避免命名冲突

所有页面已移除 Less 文件，迁移到 Tailwind + antd-style + CSS Modules 三位一体的样式方案。同时启用了 antd CSS 变量模式（cssVar），支持动态主题切换。

构建提速

v5 使用 mfsu（基于 webpack 5 Module Federation）做依赖预编译，虽然有效但有局限性。v6 切换到 utoopack（基于 Turbopack），冷启动和热更新速度有了质的飞跃。

同时启用了 routePrefetch 路由预加载，页面切换更加流畅。

AI 能力

v6 新增了 AI 助手页面，基于 Ant Design X 构建。这是一个开箱即用的聊天界面示例，展示了如何在 Pro 项目中集成 AI 对话能力。

工具链现代化

Biome 替代 ESLint + Prettier

v6 用 Biome 统一了代码检查和格式化。一个工具搞定 lint + format，速度快 10 倍以上，配置也更简洁。告别 .eslintrc、.prettierrc 一大堆配置文件的日子。

React Query 替代 useRequest

数据请求层从 umi 内置的 useRequest 迁移到 @tanstack/react-query。更强大的缓存管理、请求去重、乐观更新、无限滚动——中后台最常见的需求都有了现成方案。

其他工具链更新

• yorkie → husky：更稳定的 Git hooks
• moment → dayjs：体积更小的日期库
• lodash → 原生 API / clsx：减少依赖体积
• Class 组件 → 函数式组件：全面拥抱 Hooks
• Docker 配置移除：精简项目结构
• pro-cli → 直接 git clone + npm run simple：更透明的初始化方式

Cloudflare Worker 后端

v6 的演示 API 迁移到了 Cloudflare Worker（基于 Hono 框架）。这是一个独立的 cloudflare-worker/ 目录，有自己的 package.json 和 tsconfig.json，不与主项目耦合，可以独立部署。

D3 地图可视化

监控页的地图从 @antv/L7 替换为 D3 hex-tile 可视化方案。L7 需要独立的 Mapbox token 才能工作，对演示和本地开发都不友好。D3 方案零配置，开箱即用。

Cheatsheet 速查文档

新增了 Cheatsheet 速查文档，基于 @ant-design/x-markdown 渲染，支持语法高亮和暗色模式。开发者可以在 Welcome 页面直接查看路由、布局、请求、权限等常用配置，无需跳转外部文档。

升级指南

v6 是一次大版本升级，涉及框架和依赖的全面更新。如果你正在使用 v5，推荐的方式是新建 v6 项目，逐步迁移业务代码，而非在原项目上升级。主要变更点：

1. 依赖替换：umi → @umijs/max，分散的 ProComponents 包 → @ant-design/pro-components
2. 样式迁移：Less → Tailwind + antd-style + CSS Modules
3. 导入路径：from 'umi' → from '@umijs/max'
4. 请求方式：useRequest → @tanstack/react-query
5. 代码检查：ESLint + Prettier → Biome
6. 日期库：moment → dayjs

由于升级跨度较大，官方提供了 npm run simple 命令来快速生成最小化模板，从这个干净的起点开始会比逐一迁移更高效：

git clone --depth=1 https://github.com/ant-design/ant-design-pro.git myapp
cd myapp
npm install
npm run simple  # 精简为最小模板

完整更新日志

核心框架升级

• 升级到 React 19 (#11474)
• 升级到 antd 6 (#11471, #11604, #11645, #11695)
• 升级到 Umi Max 4 / @umijs/max (#9956, #11589, #11686)
• ProComponents 统一为 @ant-design/pro-components v3
• @ant-design/icons 升级到 v6 (#11565)
• moment → dayjs
• lodash → 原生 API / clsx
• rc-util → @rc-component/util

样式体系

• Less 全部移除，迁移到 Tailwind CSS + antd-style + CSS Modules (#10938, #10941, #10970, #10971, #10972, #10973, #10975)
• Tailwind CSS v3 → Tailwind CSS v4 (#11576, #11668)
• 启用 antd CSS 变量模式 (cssVar) (#11499)
• AlibabaSans 作为默认字体 (#11499)
• 全局表单 variant 设为 filled 样式 (#11650)

构建与工具链

• mfsu → utoopack (基于 Turbopack) (#11326)
• ESLint + Prettier → Biome (#11572, #11694)
• yorkie → husky
• umi-presets-pro → 直接使用插件 (#11651)
• TypeScript 升级到 6.x (#11637, #11696)
• Docker 配置移除
• pro-cli 移除，使用 git clone + npm run simple (#11617)

新增功能

• AI 助手页面 (@ant-design/x) (#11681)
• React Query 数据请求 (@tanstack/react-query) (#11665)
• Cloudflare Worker API (Hono) (#11655, #11659)
• D3 hex-tile 地图替代 L7 (#11709)
• 路由预加载 (routePrefetch) (#11652)
• 骨架屏 Loading 组件 (#11505, #11510)
• Cheatsheet 速查文档 (#11712)
• 版本号和 commit hash 显示在页脚 (#11660)
• 历史版本链接 (#11725)
• exportStatic 静态导出支持 (#11512)
• 错误页面卡片包裹 (#11513)

架构重构

• Class 组件 → 函数式组件 (#11616)
• 提取共享组件 (#11692)
• 提取共享 Mock 工具 (#11674)
• 请求管线和 React Query 优化 (#11693)
• 减小包体积，替换重度依赖 (#11698)
• 移除未使用页面和路由 (#11506, #11507)
• 移除 Fragment 包装，简化 Jest 配置 (#11514)

问题修复

• 修复首次加载白屏问题 (#10347)
• 修复刷新时标题不显示 (#10455)
• 修复 antd 时间选择器中文语言包缺失 (#10440)
• 修复 Hash 路由在 getInitialState() 中被忽略 (#10352)
• 修复登录页 title={false} 不生效 (#11364)
• 修复 SearchList 标签页路由异常 (#10970)
• 修复 HeaderDropdown 响应式样式不生效 (#10669)
• 修复暗黑主题样式问题 (#11645)
• 修复 CORS 不支持多级子域名 (#11664)
• 修复 Tailwind CSS 因 Less import 顺序未生效 (#11662)
• 修复 Monitor 页面地图显示 (#11676)
• 修复 mock 路由重复注册警告 (#11657)
• 修复右侧内容区边距和边框问题 (#11646, #11698)
• 修复 ModalForm 触发器类型定义 (#11648)
• 修复安全漏洞 (#11641)
• 修复 headScripts 链接与 publicPath 不匹配 (#11289)
• 修复 404 路由 (#11528, #11096, #10007)
• 修复 404 页面横向滚动条 (#10194)
• 修复 Select.Options → options (#10971)
• 修复消息提示不自动关闭 (#10209)
• 修复 RightContent navTheme 条件值 (#10210)
• 修复登录重定向原始 URL 保留 (#11722)

国际化

• 新增西班牙语文档 (#10999)
• 新增土耳其语翻译 (#10478)
• 404 页面多语言支持 (#11064)
• 修复 zh-TW 翻译错误 (#11093)
• 修复 SettingDrawer 翻译错误 (#11037)

依赖更新

• @umijs/max → 4.6.45
• @biomejs/biome → 2.4.12
• express → 5.2.1
• Jest → 30.x
• cross-env → 10.0.0
• gh-pages → 6.1.1
• react-dev-inspector → 2.0.1
• highlight.js（新增）