用手機測試 Astro Dev Server：不用部署，一個 flag 搞定

情境

在開發 Astro 部落格時，我修了一個 iOS Safari 上的 click 事件問題（非互動元素需要 cursor: pointer 才能觸發 click）。改完程式碼後，第一個念頭是：

這必須部署完成，我才有辦法測試？

答案是不用。

只要手機和電腦在同一個 Wi-Fi 網路下，就能直接連本機 dev server 測試。啟動時加上 --host：

bun run dev --host

終端機會多顯示一行區域網路位址：

┃ Local    http://localhost:4321/
┃ Network  http://192.168.x.x:4321/

拿起手機，瀏覽器輸入 Network 那行的 IP 位址，就能即時預覽，包含 HMR 熱更新。

--host 是 Astro CLI（astro dev）的選項，底層實際上是傳給 Vite dev server 的 server.host 設定。

Astro 基於 Vite 建構，astro dev 啟動的就是 Vite dev server，所以：

指令	Vite 設定	綁定位址	效果
`astro dev`	`server.host: false`（預設）	`127.0.0.1`	只有本機可存取
`astro dev --host`	`server.host: true`	`0.0.0.0`	區域網路內所有裝置可存取

127.0.0.1 是 loopback 位址，只允許本機連線。0.0.0.0 代表監聽所有網路介面，包含 Wi-Fi 分配的區域網路 IP，所以同網段的手機就能連上來。

如果想在 astro.config.mjs 中永久啟用，可以加上：

export default defineConfig({
  server: {
    host: true,
  },
});

這等同於每次都帶 --host flag。

這不是 Astro 獨有的功能。所有基於 Vite 的框架都有相同的機制：

原理完全相同：都是把 server.host: true 傳給底層的 Vite dev server。下次在任何 Vite 系框架遇到「想用手機測」的需求，加個 --host 就行。