如何在ant-design react应用程序中使用ant-design-pro组件？

Question

我已经使用create-react-app创建了react app，并使用了ant-design组件，随着项目的扩大，我需要使用ant-design-pro中的一些很棒的组件。

有什么方法可以将ant-design-pro组件集成到现有的ant-design项目中？

我尝试导入并使用@ ant-design / pro-layout，但对我不起作用。

Answer 1

欢迎堆栈溢出！

似乎ant-design团队选择将ant-design-pro组件直接集成到antd中。 2.3.0的{​​{1}}版本是您可以用作组件库的库的最新版本。 （来源：他们的changelog）。

您可能仍可以安装该版本（here's the documentation来安装）。

他们最近发布了ant-design-pro的v4版本，我不确定是否可以独立安装这些组件。

但是，ant-design-pro中的许多组件现在都直接维护在ant-design-pro内部，如您所见here：

  

在下一版的Pro中，我们将逐步删除将要添加到正在开发的Ant Design中的所有组件：

     

...

     

这些组件将在Ant Design中得到更全面的支持和维护，而Pro将专注于布局和脚手架。

Answer 2

对于V4，请参考Upgrade to V4，如果使用@ant-design/pro-layout，请检查Replace BasicLayout。

对于单个组件，请使用npm install ant-design-pro@2.3.2并根据需要导入组件：

import Ellipsis from 'ant-design-pro/lib/Ellipsis';

演示：