423 字
2 分钟
把 Astro 站点部署到网上
Astro 默认输出静态站点。构建完成后,dist/ 里的文件就是整个网站。
先构建
pnpm build这个主题的构建会依次完成内容同步、Astro 构建、Pagefind 搜索索引和字体子集校验,所以比普通 Astro 项目稍慢一些。
如果只想在本地检查构建结果,可以再运行:
pnpm preview预览服务器会以生产模式提供 dist/ 中的文件,适合在部署前做最后一次检查。
部署清单
-
pnpm build没有报错 - 标题、描述和日期显示正确
- 站内链接可以正常跳转
- 404 页面可以访问
- 图片和字体没有 404
- 在手机上检查过排版
常见托管方式
Netlify、Vercel、Cloudflare Pages
这类平台都可以直接连接 Git 仓库,并使用下面的配置:
| 配置项 | 值 |
|---|---|
| 构建命令 | pnpm build |
| 输出目录 | dist |
| Node.js 版本 | >= 26.13.0 |
| 包管理器 | pnpm 11.x |
每次推送到主分支,平台会自动重新构建并发布。
自己的服务器
把 dist/ 上传到服务器的网站目录即可。如果使用 Nginx,一个最简单的站点配置大概是这样:
server { listen 80; server_name example.com; root /var/www/blog/dist; index index.html;
location / { try_files $uri $uri/ =404; }}记得把 example.com 和 root 换成你自己的域名与目录。
自定义域名
部署完成后,在托管平台里绑定域名,并按照提示配置 DNS。启用 HTTPS 之后,再把正式域名填回 src/config/siteConfig.ts 的 site 字段,canonical 链接、RSS 和 sitemap 才能生成正确的绝对地址。
export const siteConfig = withUserConfig("site", { site: "https://example.com/", // ...});就这样。没有服务器要维护,也没有缓存要清理。
把 Astro 站点部署到网上
https://example.com/posts/deploy-astro/分享文章
生成精美分享图或复制链接,与更多人分享本文。
继续阅读
换条路线
从其他文章中稳定抽取
最后更新于 ,距今已过 6 天
部分内容可能已过时