Installing Bootstrap
This is Bootstrap’s official documentation to import its JavaScript modules.
Install bootstrap as a Node.js module using npm.
Importing JavaScript
This is Bootstrap’s official documentation to import its JavaScript modules.
Import Bootstrap’s JavaScript by adding this line to your app’s entry point (usually index.js
or app.js
):
Alternatively, you may import plugins individually as needed:
Bootstrap depends on jQuery and Popper,
which are specified in the peerDependencies
property; this means that you will have to make sure to add both of them
to your package.json
using npm install --save jquery popper.js
.
Importing Styles
Importing Precompiled Sass
To enjoy the full potential of Material UI and customize it to your needs, use the source files as a part of your project’s bundling process.
First, create your own _custom.scss
and use it to override the built-in custom variables. Then, use your main Sass file to import your custom variables, followed by Material UI:
For Material UI to compile, make sure you install and use the required loaders: sass-loader, postcss-loader with Autoprefixer. With minimal setup, your webpack config should include this rule or similar:
Importing Compiled CSS
Alternatively, you may use Bootstrap’s ready-to-use CSS by simply adding this line to your project’s entry point:
In this case you may use your existing rule for css
without any special modifications to webpack config, except you don’t need sass-loader
just style-loader and css-loader.