Warning: [antd: compatible] antd v5 support React is 16 ~ 18. see

Warning: [antd: compatible] antd v5 support React is 16 ~ 18. see

Ant Design v5 与 React 19 兼容性警告，需要处理兼容性问题。

解决方法链接：

React 19 兼容 - Ant Design

React 19 兼容 - Ant Design

React 19 兼容 - Ant Design

React 19 兼容问题

由于 React 19 调整了 react-dom 的导出方式，导致 antd 无法直接使用 ReactDOM.render 方法。因而使用 antd 会遇到以下问题：

• 波纹特效无法正常工作
• Modal、Notification、Message 等组件的静态方法无效

因而需要通过兼容配置，使 antd 在 React 19 中正常工作。

兼容方式

以下方法任选其一，其中优先推荐使用兼容包。

兼容包

安装兼容包

bash

npm install @ant-design/v5-patch-for-react-19 --save

在应用入口处引入兼容包

tsx

import '@ant-design/v5-patch-for-react-19';

unstableSetRender

再次提醒，默认情况下，请优先使用兼容包。除非对于 umd、微应用等特殊场景，才使用 unstableSetRender 方法。unstableSetRender 为底层注册方法，允许开发者修改 ReactDOM 的渲染方法。在你的应用入口处写入：

import { unstableSetRender } from 'antd';

import { createRoot } from 'react-dom/client';

unstableSetRender((node, container) => {

container._reactRoot ||= createRoot(container);

const root = container._reactRoot;

root.render(node);

return async () => {

await new Promise((resolve) => setTimeout(resolve, 0));

root.unmount();

};

});