In the last days I applied for a new job where Vue.js was a requirement to apply, in order to get in, I needed to present a test to design a dashboard with Bootstrap Vue.
While trying to set up a new project, the CLI offered me the possibility to work With Vue 2 and Vue 3 so I decided to go on with the latest version (Vue 3). After reading the documentation, getting comfortable with the way Vue.js works, I started to create some components and they work as expected. When I was ready to start with the bootstrap library, after the installation and after trying to import the library as it theoretically should:
// main.js
import App from './App.vue'
import { createApp } from 'vue'
import { BootstrapVue, IconsPlugin } from 'bootstrap-vue'
// Install BootstrapVue
App.use(BootstrapVue)
// Optionally install the BootstrapVue icon components plugin
App.use(IconsPlugin)
createApp(App).mount('#app')When trying to build the project, the following exception will appear on the terminal:
config.js?228e:8 Uncaught TypeError: Cannot read property 'prototype' of undefined
at eval (config.js?228e:8)
at Module../node_modules/bootstrap-vue/esm/utils/config.js (chunk-vendors.js:3251)
at __webpack_require__ (app.js:849)
at fn (app.js:151)
at eval (alert.js?5fda:1)
at Module../node_modules/bootstrap-vue/esm/components/alert/alert.js (chunk-vendors.js:83)
at __webpack_require__ (app.js:849)
at fn (app.js:151)
at eval (index.js?cca8:1)
at Module../node_modules/bootstrap-vue/esm/components/alert/index.js (chunk-vendors.js:95)This problem doesn't have solution till the date as Bootstrap Vue doesn't provide support for Vue 3 yet, however it seems that the support will arrive to production soon.
Solution
For now, I hope that you are starting a project from scratch as I did because you will need to downgrade your Vue.js project from version 3 to Vue.js 2.
Happy coding ❤️!
