How to import and use min.js and min.css in React.js?

Question

I am just converting html template into React.js component.

In html template, I have these reference links.

<link rel="stylesheet" href="css/bootstrap.min.css">
<link rel="stylesheet" href="css/font-awesome.min.css">
...
<script src="js/bootstrap.min.js"></script>
<script src="js/vendor/modernizr-2.6.2.min.js"></script>
<script src="js/jquery.lwtCountdown-1.0.js"></script>
...

I want to import and use these script and CSS files in a specific component.

Does anyone have some experience with this?

Thanks in advance.

Answer 1

Install Bootstrap as node modules using npm command.

npm i bootstrap -S

It will add bootstrap dependencies to your package.json

Now, Import Bootstrap’s JavaScript by adding this line to your app’s entry point index.js or app.js

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

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