Bootstrap 적용하기

1. Bootstrap 설치

npm install vue bootstrap-vue bootstrap

 

2. main.js 설정

이제 main.js에 Bootstrap 관련 import만 해주면 된다.

 

import BootstrapVue from 'bootstrap-vue'
import 'bootstrap/dist/css/bootstrap.min.css'
import 'bootstrap-vue/dist/bootstrap-vue.css'

Vue.use(BootstrapVue)

 

 

3. Bootstrap 테스트

코드넣어보고 테스트 해본다.

<b-button variant="primary">Button</b-button>

 

 

4. Vue3.0버전

vue3.0 버전이면 bootstrap5 버전으로 설치해야한다.. 4로 설치했다가 안되가지고 헤맸네 ㅠㅠ

// terminal
npm install --save bootstrap

// main.js
import "bootstrap/dist/css/bootstrap.min.css"
import "bootstrap"