Module not found: Can't resolve 'bootstrap/dist/css/bootstrap-theme.css' in 'C:\react-form-validation-demo\src'

Question

I am newbie in react.js. I have been following instruction in how-to-do-simple-form-validation-in-reactjs and I can run http://localhost:3000/

But after adding bootstrap in index.js, I got this error

Failed to compile ./src/index.js Module not found: Can't resolve 'bootstrap/dist/css/bootstrap-theme.css' in 'C:\react-form-validation-demo\src' 

import React from 'react'; import ReactDOM from 'react-dom'; import './index.css'; import 'bootstrap/dist/css/bootstrap.css'; import 'bootstrap/dist/css/bootstrap-theme.css'; import App from './App'; import registerServiceWorker from './registerServiceWorker';  ReactDOM.render(<App />, document.getElementById('root')); registerServiceWorker(); 

If I remove these two lines below, it works:

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

Answer 1

In Bootstrap version 4, the file 'bootstrap-theme.css' have been removed, according to issue in github: https://github.com/twbs/bootstrap/issues/21078, in Change History you get detail

To use version 4 remove the import this, or else downgrade to version 3.

Answer 2

This error is caused by a misconfiguration, version mismatch or corrupted bootstrap install.

If you've got bootstrap and react-bootstrap installed already via some variation of:

npm install --save bootstrap@^4.0.0-alpha.6 react-bootstrap@^0.32.1

(Check if your package.json contains "bootstrap" and "react-bootstrap" if your not sure.)

Just install a different version of bootstrap and rebuild your project. That should replace or add that file (bootstrap/dist/css/bootstrap-theme.css) to that folder. A lower version of bootstrap worked for me as recommended in my create-react-app generated README.md:

npm install --save react-bootstrap bootstrap@3

Adding Bootstrap

You don’t have to use React Bootstrap together with React but it is a popular library for integrating Bootstrap with React apps. If you need it, you can integrate it with Create React App by following these steps:

Install React Bootstrap and Bootstrap from npm. React Bootstrap does not include Bootstrap CSS so this needs to be installed as well:

sh npm install --save react-bootstrap bootstrap@3

Alternatively you may use yarn:

sh yarn add react-bootstrap bootstrap@3