feat: upgrade to antd v6 and utoo pack - #11585
Conversation
dosubot
Bot
added
the
size:XS
|
🎊 PR Preview has been successfully built and deployed to https://ant-design-pro-preview-pr-11585.surge.sh
|
|
Note Other AI code review bot(s) detectedCodeRabbit has detected other AI code review bot(s) in this pull request and will avoid duplicating their findings in the review comments. This may lead to a less comprehensive review. Walkthrough升级依赖（Ant Design v6、Umi 包）、移除 Ant Design v5 React19 补丁，调整运行时/测试通知字段与配置项，添加测试 ResizeObserver mock，更新多个 CI 工作流的 Actions 版本与配置。未引入新运行时代码路径或导出签名变更。 Changes
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~25 minutes
Poem
Pre-merge checks and finishing touches✅ Passed checks (3 passed)
✨ Finishing touches🧪 Generate unit tests (beta)
📜 Recent review detailsConfiguration used: CodeRabbit UI Review profile: CHILL Plan: Pro 📒 Files selected for processing (3)
🚧 Files skipped from review as they are similar to previous changes (1)
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (4)
🔇 Additional comments (3)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
Summary of ChangesHello @afc163, I'm Gemini Code Assist1! I'm currently reviewing this pull request and will post my feedback shortly. In the meantime, here's a summary to help you and other reviewers quickly get up to speed! This pull request initiates the process of upgrading the project's UI framework by moving to Ant Design v6. This significant update involves bumping the Highlights
Using Gemini Code AssistThe full guide for Gemini Code Assist can be found on our documentation page, here are some quick tips. Invoking Gemini You can request assistance from Gemini at any point by creating a comment using either
Customization To customize Gemini Code Assist for GitHub experience, repository maintainers can create a configuration file and/or provide a custom code review style guide (such as PEP-8 for Python) by creating and adding files to a Limitations & Feedback Gemini Code Assist may make mistakes. Please leave feedback on any instances where its feedback is incorrect or counter productive. You can react with 👍 and 👎 on @gemini-code-assist comments. If you're interested in giving your feedback about your experience with Gemini Code Assist for Github and other Google products, sign up here. You can also get AI-powered code generation, chat, as well as code reviews directly in the IDE at no cost with the Gemini Code Assist IDE Extension. Footnotes
|
![gemini-code-assist[bot]](https://avatars.githubusercontent.com/in/956858?s=60&v=4){kind=small}
There was a problem hiding this comment.
Code Review
This PR kicks off the upgrade to Ant Design v6. You've correctly updated the main antd and @ant-design/icons packages and removed the temporary patch for React 19. However, the current changes introduce a critical issue: other dependencies like @ant-design/pro-components and antd-style are not compatible with antd v6, which will break the application. As you continue this work, remember that antd v6 has other breaking changes that will require further code updates across the project.
| "@ant-design/pro-components": "^2.8.9", | ||
| "antd": "^5.26.4", | ||
| "@ant-design/v5-patch-for-react-19": "^1.0.3", | ||
| "antd": "^6.0.0", | ||
| "antd-style": "^3.7.0", |
There was a problem hiding this comment.
Upgrading antd to v6 is a significant change that affects other packages in the Ant Design ecosystem.
@ant-design/pro-components: The current version (^2.8.9) is not compatible withantd@6. The peer dependency for@ant-design/pro-components@2.8.9isantd: ">=4.24.0 <6.0.0". You will need to upgrade@ant-design/pro-componentsto a version that supportsantd@6.antd-style: The current version (^3.7.0) is designed forantd@5. Given the styling system changes inantd@6(like CSS-in-JS variables), this version is likely incompatible. You should check for a compatible version ofantd-styleor consider migrating if a compatible version is not available.
In its current state, these incompatibilities will break the application. As this is a WIP, you may already be tracking this, but it's a critical issue to resolve for the upgrade to be successful.
|
Review the following changes in direct dependencies. Learn more about Socket for GitHub.
|
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 1
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (2)
package.json(1 hunks)src/app.tsx(0 hunks)
💤 Files with no reviewable changes (1)
- src/app.tsx
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (8)
- GitHub Check: WIP
- GitHub Check: WIP
- GitHub Check: WIP
- GitHub Check: WIP
- GitHub Check: WIP
- GitHub Check: Socket Security: Pull Request Alerts
- GitHub Check: build-preview
- GitHub Check: WIP
🔇 Additional comments (1)
package.json (1)
37-46: @ant-design/v5-patch-for-react-19 补丁已完全移除 - 验证通过已确认：
- 依赖中不存在 @ant-design/v5-patch-for-react-19（package.json ✓）
- src/app.tsx 中无相关导入（✓）
- 整个代码库中无任何引用（✓）
代码变更正确，与 antd v6 原生 React 19 支持相符。
|
本地升级了umi，可以正常启动 - "@umijs/lint": "^4.3.24",
- "@umijs/max": "^4.3.24",
+ "@umijs/lint": "^4.6.1",
+ "@umijs/max": "^4.6.1", |
|
@copilot 参考更新一下 PR - "@umijs/lint": "^4.3.24",
- "@umijs/max": "^4.3.24",
+ "@umijs/lint": "^4.6.1",
+ "@umijs/max": "^4.6.1", |
Co-authored-by: afc163 <507615+afc163@users.noreply.github.com> Co-authored-by: copilot-swe-agent[bot] <198982749+Copilot@users.noreply.github.com>
Deploying ant-design-pro with
|
| Latest commit: |
7321312
|
| Status: | ✅ Deploy successful! |
| Preview URL: | https://d59395bb.ant-design-pro-nd3.pages.dev |
| Branch Preview URL: | https://feat-upgrade-antd-v6.ant-design-pro-nd3.pages.dev |
Codecov Report✅ All modified and coverable lines are covered by tests. Additional details and impacted files@@ Coverage Diff @@
## master #11585 +/- ##
==========================================
- Coverage 53.67% 53.60% -0.08%
==========================================
Files 84 84
Lines 598 597 -1
Branches 79 81 +2
==========================================
- Hits 321 320 -1
Misses 277 277 ☔ View full report in Codecov by Sentry. 🚀 New features to boost your workflow:
|
dosubot
Bot
added
size:M
afc163
changed the title
There was a problem hiding this comment.
Actionable comments posted: 1
♻️ Duplicate comments (1)
package.json (1)
38-45: 依赖版本升级方向正确，注意后续补齐生态包兼容性本次将：
antd升级到^6.0.0，@ant-design/icons升级到^6.1.0- Umi 相关升级到
@umijs/max@^4.6.2、@umijs/lint@^4.6.1整体方向与 PR 目标一致 👍。不过当前仍然保留：
@ant-design/pro-components:^2.8.9antd-style:^3.7.0它们与
antd@6的兼容性问题已经在之前的机器人评论中标记为 critical，这里不再展开，后续合并前需要一并处理或在后续 PR 中升级。建议本地执行一次安装并检查 peerDependencies 警告，确保版本矩阵最终闭环：
npm install npm ls antd @ant-design/pro-components antd-styleAlso applies to: 58-59
🧹 Nitpick comments (2)
tests/setupTests.jsx (1)
72-78: ResizeObserver mock 建议同时挂到 window 上现在只设置了
global.ResizeObserver，如果有代码直接访问window.ResizeObserver可能仍然报错。可以顺带同步一份到window，更稳妥。-// Mock ResizeObserver -global.ResizeObserver = class ResizeObserver { - observe() {} - unobserve() {} - disconnect() {} -}; +// Mock ResizeObserver +class ResizeObserver { + observe() {} + unobserve() {} + disconnect() {} +} + +global.ResizeObserver = ResizeObserver; +if (typeof window !== 'undefined') { + // 部分依赖使用 window.ResizeObserver + // @ts-ignore + window.ResizeObserver = ResizeObserver; +}src/requestErrorConfig.ts (1)
48-64: Swap notification title and description for better UX alignment with Ant Design v6 best practices.Ant Design v6 recommends that notification titles be short, outcome-oriented, and user-friendly, while error codes should appear in the description for support reference. Currently,
titledisplayserrorCode(technical) anddescriptiondisplayserrorMessage(raw backend data). This conflicts with the convention—consider:notification.open({ title: errorMessage, description: errorCode, });This assumes
errorMessagefrom the backend is already user-friendly. If backend messages are technical, implement a client-side error mapper (as shown in Ant Design best practices) to transform error codes into friendly titles before display. The current approach is also inconsistent with other message types (WARN_MESSAGE, ERROR_MESSAGE) in this same handler, which displayerrorMessagedirectly without wrapping it in a secondary field.
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
⛔ Files ignored due to path filters (1)
src/pages/user/login/__snapshots__/login.test.tsx.snapis excluded by!**/*.snap
📒 Files selected for processing (6)
.gitignore(1 hunks)config/config.ts(1 hunks)package.json(2 hunks)src/global.tsx(1 hunks)src/requestErrorConfig.ts(1 hunks)tests/setupTests.jsx(1 hunks)
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (7)
- GitHub Check: WIP
- GitHub Check: WIP
- GitHub Check: build-preview
- GitHub Check: build (20, windows-latest)
- GitHub Check: WIP
- GitHub Check: build (20, windows-latest)
- GitHub Check: Cloudflare Pages
🔇 Additional comments (2)
.gitignore (1)
31-35: 新增 .turbopack 忽略项是合理的针对新打包器产生的缓存目录加到 .gitignore 中是正确的做法，不会影响现有流程。
src/global.tsx (1)
68-76: PWA 更新提示改用title字段是合理的这里将
notification.open的主文案从message切到title，语义和文案都保持不变，符合新版 API 要求，逻辑无问题。
There was a problem hiding this comment.
Actionable comments posted: 2
🧹 Nitpick comments (2)
.github/workflows/deploy.yml (1)
17-23: 更新步骤名称以反映实际使用的工具。工作流已正确迁移至 utoo 工具链（第 17 行的
utooland/setup-utoo@v1和第 20、23 行的 utoo 命令），但第 19 行的步骤名称仍然引用 "Bun"，与实际执行的utoo install命令不符。建议更新步骤名称以提高清晰度：
- - name: Install dependencies with Bun + - name: Install dependencies with utoo run: utoo install.github/workflows/ci.yml (1)
26-30: 确认内存配置是否适合新工具链新增的
NODE_OPTIONS: --max_old_space_size=4096将 Node.js 堆大小限制为 4GB。请确认：
- 这个内存配置是否为 utoo 工具链的推荐值
- 这个大小是否足以支持所有矩阵组合（Windows、macOS、Ubuntu）的构建
- 是否需要针对不同操作系统进行不同的内存配置
如果 Bun 被替换为需要更多内存的 utoo，当前配置可能导致某些环境下的 OOM（内存不足）错误。
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (4)
.github/workflows/ci.yml(1 hunks).github/workflows/coverage.yml(1 hunks).github/workflows/deploy.yml(1 hunks).github/workflows/preview-build.yml(1 hunks)
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (4)
- GitHub Check: build-preview
- GitHub Check: build
- GitHub Check: build
- GitHub Check: Cloudflare Pages
🔇 Additional comments (3)
.github/workflows/preview-build.yml (1)
15-15: GitHub Actions 版本升级符合预期。将
actions/checkout从 v4 升级至 v6，以获取最新的安全补丁和功能改进。参数传入保持一致，功能行为不受影响。这次升级符合 PR 的 CI 工具链现代化目标。.github/workflows/deploy.yml (1)
14-14: ✓ actions/checkout 版本升级正确。从 v4 升级到 v6 是标准的依赖更新，无功能性影响。
.github/workflows/ci.yml (1)
16-20: 验证 GitHub Actions 版本兼容性GitHub Actions 的版本升级（checkout v6 和 setup-node v5）是常规维护更新。建议验证这些新版本与项目的其他 CI 步骤的兼容性，尤其是与新的 utoo 工具链的集成。
4eb98a6 to
7321312
Compare
|
这个版本 浏览器报错： |
得用 npm 包管理器。 我提交了一个 PR 尝试修复这个问题，umijs/umi-presets-pro#21 |
Summary by CodeRabbit
Chores
Bug Fixes
Tests
✏️ Tip: You can customize this high-level summary in your review settings.