部署你的 Astro 站点至 GitHub Pages
您可以使用 GitHub Pages 直接从 GitHub 上的存储库托管 Astro 网站。
如何部署
你可以使用 GitHub Actions 将 Astro 站点自动构建和部署到 GitHub Pages。为此,你的源代码必须托管在 GitHub 上。
Astro 维护了一个官方的 GitHub Action withastro/action
来帮助你部署项目;你只需很少的配置,就可以完成部署。按照下面的说明可以将你的 Astro 站点部署到 GitHub Pages,如果你需要更多信息,请参阅这个包的 README。
-
在配置文件设置
site
,并在astro.config.mjs
中根据需要设置base
选项。site
应当为https://<YOUR_USERNAME>.github.io
或https://my-custom-domain.com
base
应当是你的存储库的名称,以正斜杠(/
)开头,例如/my-repo
。这是为了告诉 Astro 你的网站的根目录是/my-repo
,而非默认的/
。
如果出现了以下情况,则不要设置
base
参数:- 你的页面是由根文件夹所提供。
- 你的源码存储库是位于
https://github.com/<USERNAME>/<USERNAME>.github.io
。 - 你使用了自定义域名。
如果你以前没有设置
base
,并且只是配置此值以便部署到 GitHub,你可能需要根据base
更新你的内部页面链接。 -
在你的项目中的
.github/workflows/
目录创建一个新文件deploy.yml
,并粘贴以下 YAML 配置信息。Astro GitHub Action 接受几个可选的设置项。你可以通过取消注释
with:
行和你想要使用的设置值来提供这些设置项。官方提供的 Astro GitHub Action 会扫描项目根目录下的 lockfile 以检测你首选的包管理器(
npm
、yarn
、pnpm
或bun
)。你应该将包管理器自动生成的package-lock.json
、yarn.lock
、pnpm-lock.yaml
或bun.lockb
文件提交到你的存储库。 -
在 GitHub 上,跳转到存储库的 Settings 选项卡并找到设置的 Pages 部分。
-
选择 GitHub Actions 作为你网站的 Source,然后按 Save。
-
提交(commit)这个新的“工作流程文件”(workflow file)并将其推送到 GitHub。
您的网站现在应该已完成发布了!当你将更改推送到 Astro 项目的存储库时,GitHub Action 将自动为你部署它们。
你可以选择通过将一个 ./public/CNAME
文件添加到你的项目中,来设置自定义域:
这会将你的站点部署在你的自定义域而不是 <YOUR_USERNAME>.github.io
。不要忘记为你的域名提供商配置 DNS。