前面已經介紹了 Astro 的優點，相信你已經迫不及待要開始試用了！現在，我們將逐步指導你如何設定適合開發 Astro 的環境。
開發環境設置
首先，請確保你已經安裝了以下的工具和環境：
-
Node.js 和 npm：請確保你已經安裝了 Node.js 和 npm（Node Package Manager）。你可以在 Node.js 的官方網站（https://nodejs.org/）下載並安裝最新版本的 Node.js。
-
使用
Visual Studio Code (VSCode)作為你的開發工具。
注意：Astro v3.0 或更高版本僅支援 Node 版本
v18.14.1或更高。
檢查目前安裝 Node 版本
node -v
TypeScript
如果您已在本地安裝 TypeScript，請更新至至少 v5.0。
npm install typescript@latest --save-dev
建立新的 Astro 項目
npm create astro@latest
- 輸入專案名稱 這裡我將專案名稱命名為
astroTemplate
dir Where should we create your new project?
./astroTemplate
- 選擇要使用的專案模板。這裡我們選擇了
blog，系統將會安裝相關套件，以便使用預設的blog樣式進行開發。
tmpl How would you like to start your new project?
— Include sample files
> Use blog template
- Empty
接下來按照提示進行安裝：
- 問你是否要安裝依賴套件，選擇 Yes：
deps Install dependencies? (recommended)
● Yes ○ No
- 是否要使用
TypeScript，選擇 “Yes”：
ts Do you plan to write TypeScript?
● Yes ○ No
- 選擇
TypeScript的模式，這裡選擇Relaxed即可：
use How strict should TypeScript be?
— Strict (recommended)
— Strictest
> Relaxed
- 選擇是否初始化一個 Git 儲存庫，選擇 Yes：
git Initialize a new git repository? (optional)
● Yes ○ No
- 安裝完成後，切換到專案資料夾
cd astroTemplate
開始執行
安裝完成後，切換到專案資料夾並啟動開發伺服器：
npm run start
這將在本地瀏覽器中啟動開發伺服器，並自動打開你的 Astro 項目。你可以在瀏覽器中看到項目的首頁。
如下圖：
總結
透過以上步驟，你已經成功安裝了 Astro 開發環境並建立了新的 Astro 項目。現在，你可以開始使用 Astro 框架進行開發！