Hashaam zahid
Hashaam zahid

Reputation: 325

how can Include bootstrap.min.js from node modules in vue cli

i'm using vue cli . I have installed bootstrap using npm install bootstrap command. i have successfully imported @import "../node_modules/bootstrap/dist/css/bootstrap.min.css" ; on vue component but when i include script <script src="../node_modules/bootstrap/dist/js/bootstrap.min.js"></script> on index.html before closing body tag its not working.

Upvotes: 0

Views: 1906

Answers (3)

yeppymp
yeppymp

Reputation: 16

This also happened to me. I did a lot of searching, but no one had the right answer.

I used Bootstrap v5.3.3 and Vue3. I had no idea why it works :D.

Just Remove any bootstrap/boostrap.bundle.min.js import either in main.js or index.html.

All you need is to import the bootsrap.min.css ONLY on your main.js and boom it's working properly, including the dropdown, accordion, etc.

I even remove popperjs its still working fine.

Upvotes: 0

Murad
Murad

Reputation: 1162

Install bootstrap using npm

npm install bootstrap

Edit src/main.js file of your app. Import like this.

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

Upvotes: 0

8bit
8bit

Reputation: 597

Import the bootstrap js file just in main.js just like you did with the css file. So add import 'bootstrap' to the main.js.

Upvotes: 1

Related Questions