I am using the Vue.js. I want to attach the Bootstrap-vue to my project but it is not working properly. When I attach BootstrapVue the black screen is shown and nothing functionalities will perform. Can anyone tell me how to solve the problem to attach Bootstrap-vue to my project?

CodePudding user response：

You can easily use it by adding a package bootstrap-vue in your project. For a demo purpose, I am adding a cdn link of bootstrap-vue in below demo.

Demo :

new Vue({
  el: "#app",
  data: {
    name: "Sitepoint"
  }
});

<script src="https://unpkg.com/[email protected]/dist/vue.min.js"></script>
<script src="https://unpkg.com/[email protected]/dist/bootstrap-vue.min.js"></script>
<link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/bootstrap-vue.css"/>
<link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/css/bootstrap.min.css"/>
<div id='app'>
  <b-alert show> Hello {{ name }}! </b-alert>
</div>

CodePudding user response：

I am adding package bootstrap-vue on vue-cli in my project. Or you can add a package with :

With npm

npm install vue bootstrap bootstrap-vue

With yarn

yarn add vue bootstrap bootstrap-vue

and dont forget to register BootstrapVue in your app entry point (App.js or Main.js)