Deploying Nextjs app to Azure Static Web App fails on build

Question

Hi,

I've been following the guidelines to deploy NextJS application on azure as Static Web App, but unfortunately getting build failed on the build with "The app build failed to produce artifact folder: 'out'. Please ensure this property is configured correctly in your workflow file." error. We've tried the solutions on blogs and already asked questions, but we are not concluded for the solutions. The NextJS Apps does not have an .html page, some said that is the reason but I should not be needing to change the NextJS to SPA app.

158469-azure.txt

Answer 1

I had the same issue. I eventually had to edit a portion of my package.json file from:
"build": "next build", to "build": "next build && next export",

Answer 2

Turns out, the output_location is relative to app_location.

F.ex. if your output directory is src/out, you should have the following:

- task: AzureStaticWebApp@0
  inputs:
    app_location: 'src'
    app_build_command: 'npx next build'
    output_location: 'out'

Answer 3

Nextjs has a configuration file next.config.js This file can be used to indicate what the output folder should be. You can also look at the output folder that is created after you do a npm build , typically .next This is the folder name that should be used for the output_location: `

output_location: ".next" #

const nextConfig = {
    // enable static export application, add output: 'export
    // output: 'export',
   
    // Optional: Change the output directory `out` -> `dist`
    distDir: '.next',
  }