reactjs - 有什么方法可以在 React 中使用多个版本的 Bootstrap 而不会有任何麻烦？

Question

假设我在 React 应用程序的两个不同组件上导入了两个版本的 Bootstrap（Bootstrap 3 和 Bootstrap 4）。假设它们是<App/>（Bootstrap 3）和<Test/>（Bootstrap 4）。最初，我在<App/>组件上。现在，如果我导航到<Test/>加载和导入 Bootstrap 4 的组件，<App/>组件上的 Bootstrap 3 会被删除吗？或者它仍然会加载。

标签： reactjsreact-bootstrap

Answer 1

这是一个非常有趣的问题。答案取决于您如何使用Bootstrap这两个组件Test和App.

通常人们只是导入引导 css，显然这不会起作用，因为我猜是偶数Bootstrap3并且4相互冲突。

但是，如果您通过或任何 css in js 方法获取3or的片段4并在组件内部本地使用它。styled-component它在理论上会起作用。

在实践中，它还存在其他问题，因为它Bootstrap依赖于许多内部实用程序功能，只是为了让它旋转需要大量工作，如果你只是想用它来为一个组件供电，这可能不值得。

我会停在这里，你会发现相当多的库试图解决这个问题，举几个例子material-ui，reactstrap. 简单的搜索Bootstrap react会给你很多东西。