使用Azure DevOps部署Angular至Azure静态Web应用失败排查

问题描述 #

我们的Angular前端项目通过Azure DevOps流水线部署到Azure Static Web App时，使用本地自托管代理可成功部署，但切换为微软托管代理后，部署失败并抛出以下错误：

Detecting platforms...
Could not detect any platform in the source directory.
Error: Could not detect the language from repo.

问题原因 #

部署阶段下载的是已构建完成的静态文件产物，而AzureStaticWebApp@0任务默认会尝试从当前工作目录检测项目语言/平台配置（如package.json），但此时目录中只有编译后的静态资源，缺少项目配置文件，导致检测逻辑失败。

解决方案 #

方案1：调整任务工作目录与参数（推荐） #

修改部署阶段的AzureStaticWebApp@0任务配置，指定当前工作目录为已下载的静态文件目录，并跳过不必要的构建检测：

- task: AzureStaticWebApp@0
  inputs:
    azure_static_web_apps_api_token: $(deployment_token)
    app_location: "."  # 指向当前下载的artifact目录（已构建好的静态文件）
    skip_api_build: true
    skip_app_build: true  # 明确跳过前端应用构建，避免检测逻辑触发
    verbose: true
  displayName: "Deploy to Azure Static Web App Dev"

说明：

• app_location: "." 让任务直接使用当前工作目录的静态文件
• skip_app_build: true 禁止任务尝试执行前端构建操作，彻底跳过平台检测环节

方案2：发布artifact时包含必要配置文件 #

如果需要保留平台检测逻辑，可以修改Build阶段的publish步骤，将项目配置文件（如package.json）与构建产物一起发布：

- publish: $(System.DefaultWorkingDirectory)
  artifact: release-$(setVersion.projectVersion)
  displayName: "Publish build artifacts with config files"
  condition: succeeded()
  exclude: |
    node_modules/
    .angular/

然后部署阶段的任务参数保持原配置即可：

- task: AzureStaticWebApp@0
  inputs:
    azure_static_web_apps_api_token: $(deployment_token)
    app_location: "/"
    output_location: "dist/angular-frontend/browser"
    skip_api_build: true
    verbose: true
  displayName: "Deploy to Azure Static Web App Dev"

说明：此方案会增加artifact体积，仅在需要保留平台检测逻辑时使用。

验证步骤 #

修改流水线配置后，重新触发微软托管代理的流水线，确认部署流程正常执行，无平台检测错误。

内容的提问来源于stack exchange，提问作者Dinesh Nimmagadda