reactstrap - create-react-app - not found bootstrap/dist/css/bootstrap.css - v.4

Question

I am new in this. I am trying to create a react app with bootsrap 4. I am using reactstrap following the next steps:

create-react-app my-app

npm install bootstrap --save

npm install --save reactstrap@next react react-dom

Import Bootstrap CSS in the src/index.js file: import 'bootstrap/dist/css/bootstrap.min.css';

But when I start my app, I am getting this error:

Failed to compile.

./src/index.js Module not found: Can't resolve 'bootstrap/dist/css/bootstrap.css' in 'D:\React\my-app2\src'

I used to use bootstrap with CDN, you know, in my html page, link rel="stylesheet" ... etc and script src=""... etc. But using reactstrap, where are the js files? (jquery, popper, bootstrap) (are all together when I run npm install bootstrap --save ?)

Thanks

Go take a look inside the ./node_modules/bootstrap folder and you'll be able to see where is located your css file. — ChrisR
– ChrisR, Commented Mar 28, 2018 at 15:13

0leg · Accepted Answer · 2018-03-28 15:24:13Z

8

As you see from the error, it tries to look for bootstrap/dist/css/bootstrap.css inside your src folder. But if you look at your project files, you will notice that the bootstrap folder is located 1 level up (in the root) inside node_modules folder.

So either search and correct your path to:

../node_modules/bootstrap/dist/css/bootstrap.css.

Or add (if you still haven't done this) a reference to your index.js:

import '../node_modules/bootstrap/dist/css/bootstrap.css'.

This is the files tree:

+-node_modules
 |-bootstrap
  |-dist
   |-css
    |-bootstrap.css
+-src
 |-index.js

answered Mar 28, 2018 at 15:24

0leg

14.3k19 gold badges79 silver badges101 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Kick Buttowski Over a year ago

just simply amazing , and I am wondering why all the tutorials have such a path import 'bootstrap/dist/css/bootstrap.min.css'; ? any thoughts on that?

0leg Over a year ago

The file structure might depend on the tutorial. The best way is to know where the CSS file is located, what is the pass to it and use it.

Collectives™ on Stack Overflow

reactstrap - create-react-app - not found bootstrap/dist/css/bootstrap.css - v.4

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related