How to include bootstrap-vue in vue.js with npm?
14,647
Solution 1
Install vue-cli 3 and add bootstrap-vue as a plugin
Run these commands:
npm install -g @vue/cli
vue create project-name
cd project-name
vue add bootstrap-vue
The plugin will be automatically added and configured.
Solution 2
Create Project then run this command:
npm i bootstrap-vue
Author by
Abdulkadir Uyanik
Updated on June 21, 2022Comments
-
Abdulkadir Uyanik almost 2 years
I am using vue.js, webpack, npm and jQuery. Now I want to include the framework bootstrap-vue in my project. I followed the guide of https://bootstrap-vue.js.org/docs via npm and included bootstrap-vue. While starting the build-process of npm, I am getting too many errors with babel-runtime like:
ERROR in ./node_modules/bootstrap-vue/es/utils/popover.class.js Module not found: Error: Can't resolve '@babel/runtime/helpers/typeof' in 'C:\Users\abdul\WebstormProjects\editor\node_modules\ bootstrap-vue\es\utils' @ ./node_modules/bootstrap-vue/es/utils/popover.class.js 10:38-78 @ ./node_modules/bootstrap-vue/es/directives/popover/popover.js @ ./node_modules/bootstrap-vue/es/directives/popover/index.js @ ./node_modules/bootstrap-vue/es/directives/index.js @ ./node_modules/bootstrap-vue/es/index.js @ ./src/main.js
main.js:
import Vue from 'vue' import App from './App' import router from './router' import 'jquery' import BootstrapVue from 'bootstrap-vue' import 'bootstrap/dist/css/bootstrap.css' import 'bootstrap-vue/dist/bootstrap-vue.css' Vue.use(BootstrapVue) Vue.config.productionTip = false /* eslint-disable no-new */ new Vue({ el: '#app', router, template: '<App/>', components: { App } })
I have similar errors like this for other javascript files. Popover.class.js is one of them.
I except a successful run build with bootstrap-vue. Optional: I could include bootstrap-vue on other ways.