通过 Azure CLI 基于 Azure DevOps git 存储库部署 ReactJs Azure 静态 Web 应用程序

Question

我实际上正在为使用 Azure 静态 Web 应用程序在 ReactJs 中创建的 UI 项目开发持续交付管道。我想基于位于 Azure DevOps 中的 git 存储库创建静态 Web 应用并将其部署到 Azure。这背后的原因是我看到了一个巨大的机会，可以使用静态 Web 应用程序为我每天工作的系统创建 Pull Request Environment 管道，这似乎是一种超级便宜和快速的解决方案！然后管道将允许在发布到 DEV、QA、... Prod 环境之前隔离测试 Pull Request 更改。

总之，开门见山。 The official Microsoft documentation 仅提供了如何为 GitHub 存储库执行此操作的示例，但我找不到有关如何在使用 Azure DevOps git 存储库时实现此目的的任何信息：

az staticwebapp create \
    -n my-first-static-web-app \
    -g <RESOURCE_GROUP_NAME> \
    -s https://github.com/<YOUR_GITHUB_ACCOUNT_NAME>/my-first-static-web-app \
    -l <LOCATION> \
    -b main \
    --app-artifact-location "build" \
    --token <YOUR_GITHUB_PERSONAL_ACCESS_TOKEN>

我认为 az staticwebapp create 在提供的示例中的工作方式应该与 Azure DevOps 类似。我认为 Azure DevOps 中 YOUR_GITHUB_PERSONAL_ACCESS_TOKEN 的等价物是可以生成的访问令牌：

当我尝试运行以下代码时：

az staticwebapp create -l westus2 -n appNameTest1 -g TestPrEnvResourceGroup -s "https://dev.azure.com/myOrganisationName/myProjectName/_git/myRepoName -b "main" --token "generatedTokenValuefwfsdgsgsd"

我遇到以下异常；

Command group 'staticwebapp' is in preview and under development. Reference and support levels: https://aka.ms/CLI_refstatus Operation returned an invalid status 'Bad Request'

此外，我认为这无关紧要，但 TestPrEnvResourceGroup 是在 UK West 位置下创建的。它并没有告诉我太多，比如令牌或其他一些参数是否错误...

有什么想法吗？干杯

Answer 1

你试过了吗this way？

您需要从 Azure 静态 Web 应用生成部署令牌并将其保存在 YAML 中

我对 Angular app 进行了同样的尝试，效果很好

 azure_static_web_apps_api_token: $(deployment_token)

更新：根据 Github issue，目前不支持。

We currently don’t support automatically creating Azure DevOps pipelines. This is the supported path for using Azure DevOps: https://docs.microsoft.com/en-us/azure/static-web-apps/publish-devops

您可以为功能投票here

通过 Azure CLI 基于 Azure DevOps git 存储库部署 ReactJs Azure 静态 Web 应用程序

Deploy ReactJs Azure Static Web App based on Azure DevOps git repo via Azure CLI

azure

reactjs

azure-devops

azure-static-website-hosting

azure-static-web-app