Astro 常用命令

package.json 里通常会看到这几个脚本。

{
  "scripts": {
    "dev": "astro dev",
    "build": "astro build",
    "preview": "astro preview",
    "astro": "astro"
  }
}

围绕站点运行其实就三个命令，按开发顺序排列：先 dev 写代码，再 build 出产物，最后 preview 验证，下面分别说明。

`npm run dev` 启动并热更新

在终端执行下面的命令，Astro 会启动一个本地开发服务器。

npm run dev

默认地址是 http://localhost:4321，打开浏览器后看到的就是当前站点的实时预览。

开发服务器最核心的体验是热更新（HMR），当你保存任意 .astro、.md 或样式文件时，浏览器会自动刷新，几乎不需要手动操作。

你可以一边改代码一边看效果，这种即时反馈对学习效率提升很大。

使用场景：写代码、调样式、看实时效果的阶段，全程都用它。

开发满意后，执行下面的命令做一次生产构建。

npm run build

构建完成后，产物会输出到 dist/ 目录，这个目录里的文件才是真正要部署到服务器上的内容。

和 dev 相比，构建追求的是「小」而不是「快」，代码会被压缩、打包、优化，不再保留详细错误堆栈，适合上线。

使用场景：本地开发完成、准备发布时执行一次，生成可部署的静态文件。

构建完成后，可以用预览命令在本地以「接近线上」的方式查看结果。

npm run preview

预览默认也是 http://localhost:4321，但它读取的是 dist/ 里的静态文件，而不是实时编译，所以表现更接近真实部署环境。

使用场景：上线前最后核对，确认压缩后的产物在你机器上也能正常打开。

你也可以直接运行 npx astro --help 查看 Astro 提供的全部子命令。

如果 4321 端口被别的程序占了，Astro 会自动往后找一个可用端口，你也可以显式指定端口。

npm run dev -- --port 3000

先打开浏览器控制台，看是否有报错；再回终端看编译错误。

确认保存成功，必要时重启开发服务器。

尝试删除 node_modules 和 package-lock.json 后重新 npm install。