How to use bootstrap navigation bar in vue.js?

Question

In general HTML, it works well according to the documentation, but it doesn't work properly in my vue project. Is it because I didn't import popper.js? I don't think I'm exporting to html, and I'm not sure where to import it. To be precise, the normal navigation bar works, but the external content menu that works on small screens (mobile devices) does not. help me main.js

import { createApp } from 'vue'
import App from './App.vue'
import router from './routes/index.js'

createApp(App)
//plugin
.use(router)
.mount('#app')

Directory structure screenshot

My Web Application Screenshot

Answer 1

you can use

Bootstrap Vue

Or include bootstrap CSS and JS

in your "index.html"