如何使用 Prettier 在 VS Code 中自動格式化 Astro 檔案

了解如何在 VS Code 中使用 Prettier 來格式化 .astro 檔案。

使用 Astro 的一個缺點是 Prettier 無法理解它的語法。

因此，在 VS Code 中無法在儲存/貼上時自動格式化。

那麼，如何在 VS Code 中使用 Prettier 自動格式化 Astro 檔案呢？

為了讓它運作，我們需要進行一些設定。

首先，安裝 Web 開發的預設格式化工具 Prettier。

Prettier 並沒有針對 Astro 的特定格式化工具。

所以在專案資料夾中，執行以下指令來安裝這個插件 https://github.com/withastro/prettier-plugin-astro

npm install -D prettier-plugin-astro

現在，確保在 VS Code 的設定中啟用了 Editor: Format On Save 和 Editor: Format On Paste。

接下來，當你儲存檔案或貼上程式碼時，你應該可以看到它被格式化。

如果這個功能沒有運作，請確保在 VS Code 中打開了特定的專案資料夾，而不是該專案的父資料夾。

這可能導致 Astro 格式化工具無法運作。