如何使Bootstrap 3和Ant Design 3一起生活

时间:2018-07-10 13:09:44

标签: twitter-bootstrap-3 antd

我们正在开发一个React应用程序(使用Create React App而不弹出它),我们决定使用Ant作为我们的基本组件库。 现在我们已经接近项目的结尾,我们发现该应用程序将作为“ portlet”集成到公司门户(WebSphere)中,因此我们将从主页继承所有CSS文件。

两个框架似乎都有自己的 reset 样式,但是它们使用不同的值。 到目前为止,我还无法在Ant中找到一个LESS变量,该变量可以用于前缀所有Ant的CSS规则。

有没有人试图让他们在一起生活?

我们不拥有父级开发,我们只能在React部分进行更改,因此只能进行与Ant相关的事情。

3 个答案:

答案 0 :(得分:0)

在这里您可以看到一些default antd variables

其中之一是@ant-prefix: ant;。我认为您可以更改它并应用不同的样式。

答案 1 :(得分:0)

那是一个艰难的过程,在开发结束时同样如此!

就像@froston所提到的那样,您似乎还尝试了@ant-prefix: ant;,您将需要prefixCls作为您创建的每个组件实例的支持,这肯定是一个自我鞭打运动。

即使您设置了一个全局常量并导入并与您的组件一起使用,您仍必须将其穿通到所有位置,并且需要在其后附加组件名称。

举例来说,锚点的defaultPropsprefixCls: 'ant-anchor'

希望这会有所帮助,祝你好运!

答案 2 :(得分:0)

我们终于有了一个特定的CSS补丁文件,并在需要时添加了规则。

并不是很完美,但是没有一条建议的路径可以完成我们期望的工作。