Unable to deploy Next.js to Azure Static Web App via Github Actions

Hernan Peralta 0 Reputation points
2023-09-19T19:15:55.41+00:00

Hello! I'm trying to deploy a Next.js (v12) app to Azure static web app via Github actions, here's a snippet of main.yml:

- name: Build and copy necessary static files to standalone directory
        run: npm run deploy
      - name: Deploy
        id: swa
        uses: azure/static-web-apps-deploy@latest
        with:
          azure_static_web_apps_api_token: ${{ secrets.AZURE_STATIC_WEB_APPS_TOKEN }}
          repo_token: ${{ secrets.GITHUB_TOKEN }}
          action: "upload"
          app_location: "/"
          api_location: ""
          output_location: ".next/standalone/.next/server/pages" //if I put other paths but this it will complain about not finding an index.html
        env:
          IS_STATIC_EXPORT: true

this is what npm run deploy above does:

    "deploy": "next build && cp -r .next/static .next/standalone/.next/ && cp -r public .next/standalone/",

and this is my next.config.js:

/** @type {import('next').NextConfig} */
const nextConfig = {
  reactStrictMode: true,
  output: 'standalone', //as per Microsoft tutorial for deploying a hybrid Next.js site
  typescript: {
    tsconfigPath: './tsconfig.json',
  },
  env: {
  },
  eslint: {
    dirs: ['src', 'cypress'],
  },
};
module.exports = nextConfig;

when I access the deployed site I see the homepage in plain Html but the static assets (eg: azureUrl/_next/static/css/ab44ce7add5c3d11.css) are not found (404). Any clues on what am I missing in my configuration?

Thanks!

Azure Static Web Apps
Azure Static Web Apps
An Azure service that provides streamlined full-stack web app development.
1,094 questions
{count} votes

Your answer

Answers can be marked as Accepted Answers by the question author, which helps users to know the answer solved the author's problem.