你当前正在访问 Microsoft Azure Global Edition 技术文档网站。如果需要访问由世纪互联运营的 Microsoft Azure 中国技术文档网站，请访问 https://docs.azure.cn。

将 Gatsby 站点部署到 Azure Static Web 应用

本文演示如何创建 Gatsby Web 应用程序并将其部署到 Azure 静态 Web 应用。最终结果是一个新的静态 Web 应用站点（其中包含关联的 GitHub 操作），使你可以控制如何生成和发布应用。

在本教程中，你将了解如何执行以下操作：

如果没有 Azure 订阅，请在开始之前创建一个 Azure 免费帐户。

先决条件

使用 Gatsby 命令行接口 (CLI) 创建 Gatsby 应用：

初始化 Git 存储库

git init
git add -A
git commit -m "initial commit"

注意

如果你使用的是最新版本的 Gatsby，你可能需要修改 package.json 以包含 "engines": { "node": ">=18.0.0" },

你需要具有 GitHub 上的存储库来创建新的 Azure 静态 Web 应用资源。

从 https://github.com/new 创建一个名为 gatsby-static-web-app 的空白 GitHub 存储库（不创建自述文件）。
接下来，将刚创建的 GitHub 存储库作为远程存储库添加到本地存储库。确保添加 GitHub 用户名，来替代下面命令中的 <YOUR_USER_NAME> 占位符。
```
git remote add origin https://github.com/<YOUR_USER_NAME>/gatsby-static-web-app
```
将本地存储库推送到 GitHub。
```
git push --set-upstream origin main
```

下列步骤说明了如何创建新的静态站点应用并将其部署到生产环境。

在“基本信息”选项卡上，输入下列值。

属性	值
订阅	Azure 订阅名称。
资源组	my-gatsby-group
名称	my-gatsby-app
计划类型	免费
Azure Functions API 和过渡环境的区域	选择离你最近的区域。
Source	GitHub

如果不打算继续使用此应用程序，可按以下步骤删除 Azure 静态 Web 应用资源：