Deploying a Turborepo Next.js App to Azure Static Web App

Question

I'm attempting to deploy a Next.js site in a Turborepo monorepo to an Azure Static Web App using GitHub actions and a custom build step. The Next.js site is configured to use a standalone output, but otherwise follows preset configurations. The deployment job is failing with the following error:

Failed to find a default file in the app artifacts folder (apps/web/.next). Valid default files: index.html,Index.html.
If your application contains purely static content, please verify that the variable 'app_location' in your workflow file points to the root of your application.

The build and deploy job configuration is as follows:

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
        cp apps/web/staticwebapp.config.json apps/web/.next
    - 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/.next"
        api_location: ""
        output_location: ""

What configuration or additional steps are required to deploy a Next.js app in a Turborepo monorepo to an Azure static web app? I confirmed that the same app outside of the monorepo context can be successfully deployed, but this was able to be done without a custom build step.

Repo: https://github.com/westonsankey/turbo-demo

Artamas

The app_location path must be the the one where your default file resides. – Licastro

Try with app_location: "/" and check once. – Licastro

app_location variable should be in "app/web/. next" it's indicating error due to location – Inexpert

Could you please share your GitHub Repo. – Licastro

Added repo link. – Artamas

Answer 1

I find that the app_location should be pointing at apps/web.

If you build your application, you should see .next output in the following directory structure:

.
├── apps
│   └── web
│       ├── .next
│       │   └── standalone
│       │       ├── apps
│       │       │   └── web
│       │       │       └── server.js
│       │       └── package.json
│       ├── package.json
│       └── staticwebapp.config.json
├── .github
│   └── workflows
│       └── azure-static-web-apps.yml
├── package.json
└── turbo.json

The contents of apps/web/.next/standalone/apps/web/ must be moved to apps/web/.next/standalone/.

Try this build configuration instead:

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
        cp -r apps/web/.next/standalone/apps/web/. apps/web/.next/standalone
        cp apps/web/staticwebapp.config.json apps/web/.next
    - 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"
        api_location: ""
        output_location: ""

Here is a useful sample repo using turborepo and pnpm workspaces (I'm not the author):

https://github.com/vivekjilla/pnpm-nextjs-sample/

Neille