部署Next.js应用至Azure静态网站时遇.next文件夹生成失败错误

错误信息 #

The app build failed to produce artifact folder: '.next'. Please ensure this property is configured correctly in your deployment configuration file.

问题分析 #

你的部署配置存在两个核心问题：

1. 工件路径匹配错误：PublishBuildArtifacts@1将code/.next的内容发布为next-js-artifact，此时工件根目录就是.next里的文件，而非包含.next文件夹。但AzureStaticWebApp@0的output_location设为.next，导致Azure在工件根目录寻找不存在的.next文件夹。
2. 多余的工件发布步骤：AzureStaticWebApp@0任务可直接读取构建后的本地文件，无需先通过PublishBuildArtifacts@1发布工件，这一步反而增加了路径混淆。

另外，package.json里的"path": "cd code"脚本无效，npm不会自动执行该前置脚本，建议删除避免混淆。

修复方案 #

1. 调整Azure Pipeline YAML配置 #

删除多余的PublishBuildArtifacts@1步骤，直接让AzureStaticWebApp@0读取code目录下构建好的.next文件夹：

trigger:
- main

pool:
  vmImage: 'ubuntu-latest'

steps:
- task: NodeTool@0
  inputs:
    versionSpec: '20.x'
  displayName: 'Install Node.js'

- script: node --version
  displayName: 'Verify Node.js version'

- script: |
    cd code
    npm install
    npm run build
  displayName: 'Build Next.js application'

- task: AzureStaticWebApp@0
  inputs:
    azure_static_web_apps_api_token: 'My_Token_value_here'
    app_location: 'code'  # 指向Next.js项目所在的code文件夹
    output_location: '.next'  # code文件夹内构建后生成的.next目录

2. 清理package.json无效脚本 #

删除无用的"path"脚本，保留核心构建命令即可：

"scripts": {
  "dev": "next dev",
  "build": "next build",
  "build:azure": "next build",
  "start": "next start",
  "lint": "next lint",
  "storybook": "storybook dev -p 6006",
  "build-storybook": "storybook build"
},

关键配置说明 #

• app_location: 设置为code，告知Azure静态Web应用你的Next.js项目根目录位于该文件夹下。
• output_location: 设置为.next，指定项目构建后生成的输出目录（相对于app_location的相对路径）。

内容的提问来源于stack exchange，提问作者Code Noob