標題重寫為：VueJS中的Bootstrap問題：app.scss未載入且b-alert dismissable按鈕顯示異常

Question

這是我第一次在我的vuejs專案中使用bootstrap，有兩件事對我來說不清楚。

我按照這裡的bootstrap in vuejs指南一步一步地添加，直到我不得不創建app.scss，我決定把它放在assets文件夾中，一旦我在main.js中導入該文件，我就會從vuejs得到一個長長的錯誤。

第二個問題： 我決定放棄app.scss的全域樣式（如果這是正確的術語），只是嘗試一下bootstrap，作為一個最基本的例子，我在這個例子bootstrap playground中找到了這個例子，然後我把它複製貼上到我的vue項目中。

現在我看到一些按鈕的樣式，但結果與前面提到的網站的輸出不同。

我的關閉按鈕是灰色的，帶有邊框和X，位於文字的左側。 playground範例中的X按鈕位於文字的右側，樣式正確，沒有邊框，顏色是綠色/藍色。

這可能是非常基本的東西，但如果有人告訴我我做錯了什麼，我會很感激，因為我按照文件並且誠實地搜索了3個小時，沒有解決方案。

Answer 1

正如Hiws在上面的評論中指出的那樣，這可能是由於錯誤的Bootstrap版本導致的。當我安裝了Bootstrap 5時，我遇到了完全相同的問題，當我改為使用Bootstrap 4時，可關閉的對話框就按照我預期的方式運行了。