Bootstrap 4 components for Vue.js 2

⚠ Release Notes

✔ Getting started

Please refer to Official Documentation for setup guide, examples and documentation.

1. Download dependencies:

yarn add bootstrap-vue
yarn add bootstrap@4.0.0-alpha.6
yarn add -D style-loader

2. Register BootstrapVue in your app entrypoint:

import Vue from 'vue'
import BootstrapVue from 'bootstrap-vue';

Vue.use(BootstrapVue);

3. Import styles using style-loader:

import 'bootstrap/dist/css/bootstrap.css'
import 'bootstrap-vue/dist/bootstrap-vue.css'

For users of Webpack or Webpack-Simple from vue-cli follow these instructions:

1. Download the dependencies:

yarn add bootstrap-vue
yarn add bootstrap@4.0.0-alpha.6
yarn add -D style-loader

2. In src/main.js, add the following lines, in priority order:

import Vue from 'vue';
/* ( there may be other imports here ) */
import BootstrapVue from 'bootstrap-vue/dist/bootstrap-vue.esm';
import 'bootstrap-vue/dist/bootstrap-vue.css';
import 'bootstrap/dist/css/bootstrap.css';
/* ( there may be other imports here ) */

Vue.use(BootstrapVue);

Note on style-loader:

If you are unable or do not want to add style-loader as a developer dependency, you have to manually include both Bootstrap's and BootstrapVue's CSS files in your bundle or reference them from static/ via index.html.

License

MIT