目前使用Vue Cli建置專案已經可以選擇使用Vue 3。
這裡不使用Bootstrap-vue，因為它目前還不支援Vue 3，而且我個人覺得它有點肥，還有一個原因是，這樣使用Bootstrap比較貼近原本的Html、css語法，有些範例樣板比較容易複製貼上，不必遵循Vue組件的語法。
因此我們用較原始的方式安裝Bootstrap，使用下面指令安裝，因為Bootstrap本身有依賴jquery，因此這樣的專案會變成Vue和jquery共存。
npm install –save bootstrap jquery popper.js
安裝完後在main.js下引入Bootstrap：
import 'bootstrap';
因為等等接著會使用scss來引入bootstrap原本的css，所以在main.js不必另外引入，如果不使用scss引入則加入這行
import 'bootstrap/dist/css/bootstrap.min.css';
接著如果要使用scss來自定全部的顏色，要先安裝sass-loader
npm install -D sass-loader sass
然後新增一個檔案在assets/custom.scss
$primary: blue; $danger: red; @import "bootstrap";
最後要在main.js引入這個scss，必須在引入Bootstrap之前，這樣就大功告成了。
以下為main.js完整程式大概會像這樣。
import { createApp } from 'vue'
import App from './App.vue'
import router from './router'
import store from './store'
import '@/assets/custom.scss';
import 'bootstrap';
createApp(App).use(store).use(router).mount('#app');