In create-react-app, adding Bootstrap 4?

Mark picture Mark · Jan 3, 2018 · Viewed 15.6k times · Source

Since create-react-app hides Webpack config without having to use eject, if I want to use something like reactstrap or react-bootstrap, should I eject or will I be fine without ejecting?

Just curious as to what point one would decide when they need to eject in order to use what they need? At this point in my app, I am merely prototyping, but it will go further with more dependencies and whatnot.

Answer

sudo bangbang picture sudo bangbang · Jan 3, 2018

When using create-react-app, you don't need to eject or edit webpack config for using react-bootstrap.

Install react-bootstrap

npm install --save react-bootstrap bootstrap@3

You have to import css separately by adding this to the top of your src/index.js

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

Check out the documentation for using react-bootstrap.

Most dependencies can be added without changing webpack config. You can add packages and start using them.

If you're really concerned about the possibility of changing webpack config, I'd urge you to checkout roadhog. It's a configurable alternative of create-react-app