Skip to content

How to use bootstrap 4 in vue.js 2 without bootstrap-vue?

I’m wodering how can I integrate bootstrap 4 into my vue.js 2.6. I know there are tons of tutorials out there but all of them either are obsolete in late 2020, or require useing bootstrap-vue which brings a host of junk tags into the table which I abhore.

So I appreciate if you could provide a paractical full example of such integration with vanilla bootstrap 4.

Answer

You can use vanilla bootstrap in a vue project. Just install bootstrap by running

npm i bootstrap popper.js jquery

Popper.js and jquery are dependencies of bootstrap. In your main.js file, you import bootstrap by adding:

import "bootstrap";
import "boostrap/dist/css/bootstrap.min.css";