在同一个React项目中使用两个UI库的缺点?

时间:2018-07-12 00:48:44

标签: javascript reactjs material-ui antd

由于技术原因,我确定这是个坏主意,但尚未找到任何来源来解释它是或为什么。

假设我正在建立一个React网站,并想使用两个组件框架,例如ant.design和material-ui,因为我喜欢ant.design所做的90%的工作,但我只是稍微喜欢在material- ui更多,并希望将它们与ant.design组件结合使用。

他们似乎彼此之间玩得很好。

为什么这是个坏主意?将来是否有可能发生冲突?这会以某种方式加剧肿胀吗?

1 个答案:

答案 0 :(得分:1)

您可能想参考昨天问的这个问题以获取一些提示:

How to make Bootstrap 3 and Ant Design 3 live together

如上所述:

  • 膨胀-不必要地包含不需要的代码,可以通过自定义版本来避免。
  • 重复/覆盖-现有重复项包含的代码或仅用于覆盖现有规则的代码,使该代码毫无意义地达到50%。
  • 冲突-冲突的JS代码可能会引起问题,尤其是潜在的版本依赖性冲突。
  • 名称间隔-如链接问题中所述,无法为antd CSS命名空间以避免与引导冲突。
  • 代码样式-不会以完全相同的方式实现两个库,您将发现自己必须解决由此引起的问题。

以我自己的经验,我从来没有发现可以提供所有内容的单个库/套件,但是我发现最接近的是Ant Design。

从视觉上看,这可能不是最好的,并且可能存在一些开发人员不喜欢的实现/模式问题,但现实情况是,构建的次数越少,交付速度就越快,最终用户将更加关心功能方面,它们将比您的应用看起来更像。您确定在这些事情上的优先级肯定会与它们不同。

我个人喜欢Material UI和其他外观,如下所示:

https://hackernoon.com/23-best-react-ui-component-libraries-and-frameworks-250a81b2ac42

但是现实是,您需要查看哪个单一框架和一组组件可以提供您实际需要的最佳和最完整的功能。

就我而言,这就是Ant Design;是唯一具有一组强大的UI组件(包括日期选择器等)的组件,而不必通过NPM将越来越多的组件添加到我的代码库中。