在create-react-app中,添加Bootstrap 4？

Question

由于create-react-app隐藏Webpack配置而不必使用eject,如果我想使用像reactstrap或react-bootstrap之类的东西,我应该弹出还是我会没有弹出而没有弹出？

只是想eject知道他们需要什么时候才能使用他们需要的东西？在我的应用程序的这一点,我只是原型,但它将进一步与更多的依赖和诸如此类的东西.

Answer 1

使用create-react-app时,您无需弹出或编辑webpack配置以使用react-bootstrap.

安装react-bootstrap

npm install --save react-bootstrap bootstrap@3

您必须通过将css添加到您的顶部来单独导入 src/index.js

import 'bootstrap/dist/css/bootstrap.css';
import 'bootstrap/dist/css/bootstrap-theme.css';

查看使用react-bootstrap的文档.

可以在不更改webpack配置的情况下添加大多数依赖项.您可以添加包并开始使用它们.

如果您真的担心更改webpack配置的可能性,我会敦促您检查roadhog.它是create-react-app的可配置替代品

Answer 2

现在使用最新版本的bootstrap更容易:https://getbootstrap.com/docs/4.1/getting-started/webpack/

安装引导程序和依赖项:

npm install bootstrap jquery popper.js --save

然后在你的app入口点(index.js)导入bootstrap和css:

import 'bootstrap';
import 'bootstrap/dist/css/bootstrap.min.css';

很高兴去!