在vue中使用bootstrap

使用vue框架之下,又想使用bootstrap快速美化自己的頁面的方式

這篇記錄一下vue3 composition API底下如何使用bootstrap。

首先查到網路上有套件bootstrap-vue可以使用

但好像還沒完全支援到vue3

因此我這邊採用bootstrap官方的步驟再自己修改一下

安裝bootstrap與相關套件

 

在現有專案底下

npm i --save bootstrap @popperjs/core
npm i --save-dev sass

加入相關路徑

main.js

import * as bootstrap from 'bootstrap'

現有的style.css

@import "../node_modules/bootstrap/scss/bootstrap.scss";

 

這樣就能生效了!

不過後來又跳槽到tailwindCSS,這個就後面再說