Turborepo单仓Next.js应用部署Azure静态Web应用失败求助

问题根源 #

你的Next.js配置了standalone输出，构建后的产物结构和常规静态输出不同：.next目录下没有直接的index.html，核心运行文件在.next/standalone/apps/web目录，同时还需要public文件夹和.next/static目录的静态资源才能正常运行。当前配置直接指向.next目录，Azure找不到入口文件，导致报错。

修正步骤 #

1. 调整构建脚本，整理部署所需文件 #

修改GitHub Actions中的构建步骤，将standalone产物、静态资源和配置文件整理到一个统一的部署目录（比如apps/web/deploy）：

npm install turbo -g
npm i
turbo run build --filter=web
# 创建部署目录
mkdir -p apps/web/deploy
# 复制standalone核心文件到部署目录
cp -r apps/web/.next/standalone/apps/web/* apps/web/deploy/
# 复制静态资源目录
cp -r apps/web/.next/static apps/web/deploy/.next/
# 复制public目录
cp -r apps/web/public apps/web/deploy/
# 复制staticwebapp.config.json配置文件
cp apps/web/staticwebapp.config.json apps/web/deploy/

2. 更新Azure部署任务的参数 #

将app_location指向整理好的部署目录，同时因为Next.js standalone是Node.js应用，需要指定api_location（Azure静态Web应用会识别目录下的server.js作为入口）：

- name: Build And Deploy
  id: builddeploy
  uses: Azure/static-web-apps-deploy@v1
  with:
    azure_static_web_apps_api_token: ${{ secrets.AZURE_STATIC_WEB_APPS_API_TOKEN_HAPPY_WAVE_0A47E7A0F }}
    repo_token: ${{ secrets.GITHUB_TOKEN }}
    action: "upload"
    skip_app_build: true
    app_location: "apps/web/deploy"
    api_location: "." # 因为server.js在deploy目录根目录
    output_location: ""

3. 验证Next.js配置（可选） #

确保你的Next.js项目next.config.js中正确开启了standalone模式：

/** @type {import('next').NextConfig} */
const nextConfig = {
  output: 'standalone',
}

module.exports = nextConfig

完整的构建部署步骤代码 #

build_and_deploy_job:
  if: github.event_name == 'push' || (github.event_name == 'pull_request' && github.event.action != 'closed')
  runs-on: ubuntu-latest
  name: Build and Deploy Job
  steps:
    - uses: actions/checkout@v3
      with:
        submodules: true
    - run: |
        npm install turbo -g
        npm i
        turbo run build --filter=web
        # 整理部署文件
        mkdir -p apps/web/deploy
        cp -r apps/web/.next/standalone/apps/web/* apps/web/deploy/
        cp -r apps/web/.next/static apps/web/deploy/.next/
        cp -r apps/web/public apps/web/deploy/
        cp apps/web/staticwebapp.config.json apps/web/deploy/
    - name: Build And Deploy
      id: builddeploy
      uses: Azure/static-web-apps-deploy@v1
      with:
        azure_static_web_apps_api_token: ${{ secrets.AZURE_STATIC_WEB_APPS_API_TOKEN_HAPPY_WAVE_0A47E7A0F }}
        repo_token: ${{ secrets.GITHUB_TOKEN }}
        action: "upload"
        skip_app_build: true
        app_location: "apps/web/deploy"
        api_location: "."
        output_location: ""

内容的提问来源于stack exchange，提问作者Weston Sankey