N
Nuxt•3mo ago
code

Azure webapp github build and deploy action failing for nuxt4

Fail log: 
Detecting platforms...
Detected following platforms:
  nodejs: 18.20.8
  php: 8.0.30
Version '18.20.8' of platform 'nodejs' is not installed. Generating script to install it...
Version '8.0.30' of platform 'php' is not installed. Generating script to install it...
Detected the following frameworks: Nuxt.js

...

Using Node version:
v18.20.8

Using Npm version:
10.8.2

Running 'npm install'...

npm warn EBADENGINE Unsupported engine {
npm warn EBADENGINE   package: '@es-joy/jsdoccomment@0.56.0',
npm warn EBADENGINE   required: { node: '>=20.11.0' },
npm warn EBADENGINE   current: { node: 'v18.20.8', npm: '10.8.2' }
npm warn EBADENGINE }
npm warn EBADENGINE Unsupported engine {
npm warn EBADENGINE   package: '@isaacs/balanced-match@4.0.1',
npm warn EBADENGINE   required: { node: '20 || >=22' },
npm warn EBADENGINE   current: { node: 'v18.20.8', npm: '10.8.2' }
npm warn EBADENGINE }


...
---End of Oryx build logs---
Oryx has failed to build the solution.
Detecting platforms...
Detected following platforms:
  nodejs: 18.20.8
  php: 8.0.30
Version '18.20.8' of platform 'nodejs' is not installed. Generating script to install it...
Version '8.0.30' of platform 'php' is not installed. Generating script to install it...
Detected the following frameworks: Nuxt.js

...

Using Node version:
v18.20.8

Using Npm version:
10.8.2

Running 'npm install'...

npm warn EBADENGINE Unsupported engine {
npm warn EBADENGINE   package: '@es-joy/jsdoccomment@0.56.0',
npm warn EBADENGINE   required: { node: '>=20.11.0' },
npm warn EBADENGINE   current: { node: 'v18.20.8', npm: '10.8.2' }
npm warn EBADENGINE }
npm warn EBADENGINE Unsupported engine {
npm warn EBADENGINE   package: '@isaacs/balanced-match@4.0.1',
npm warn EBADENGINE   required: { node: '20 || >=22' },
npm warn EBADENGINE   current: { node: 'v18.20.8', npm: '10.8.2' }
npm warn EBADENGINE }


...
---End of Oryx build logs---
Oryx has failed to build the solution.
Onyx is forcing me into node v17, is there any solution to this?
11 Replies
kapa.ai
kapa.ai•3mo ago
Hi @code. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave: ---------------------- Your build is failing because Nuxt 4 (and its dependencies, like Vite and Nitro) now require Node.js 20 or newer. Your Azure Web App build environment is using Node.js 18.20.8, which is not supported by recent Nuxt versions and some of their dependencies, as shown by the EBADENGINE warnings in your logs. This is a known and intentional requirement: Nuxt's documentation and recent pull requests confirm that Node.js 20+ is the minimum version required for Nuxt 4 projects, due to upstream requirements from Vite and Nitro as well docs: use node v20 for minimum requirement for nuxt setup Installation. Solution:
You need to configure your Azure Web App (Oryx) build pipeline to use Node.js 20 or newer. The knowledge sources do not provide Azure-specific instructions, but the general requirement is clear: Nuxt 4 will not build or run on Node.js 18. If Oryx is forcing Node.js 18, you must override this by explicitly setting the Node.js version to 20 or higher in your Azure build configuration. This is typically done by specifying an engines field in your package.json: 
"engines": {
  "node": ">=20.0.0"
}
"engines": {
  "node": ">=20.0.0"
}
Or by setting an environment variable or configuration in your Azure pipeline to use Node.js 20+. Summary:
You must upgrade your build environment to Node.js 20 or newer to successfully build and deploy Nuxt 4 applications. Node.js 18 is no longer supported for Nuxt 4 Installation docs: use node v20 for minimum requirement for nuxt setup. ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------
kapa.ai
kapa.ai•3mo ago
<@708156039115178014> Kapa.ai is still learning and improving, please let me know how I did by reacting below.
code
codeOP•3mo ago
name: Azure Static Web Apps CI/CD

on:
  push:
    branches:
      - production
  pull_request:
    types: [opened, synchronize, reopened, closed]
    branches:
      - production

jobs:
  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
          lfs: false

      - name: Setup Node.js 22
        uses: actions/setup-node@v4
        with:
          node-version: '22'
      
      - name: Install Dependencies
        run: |
          npm ci
          npm install zod zod-to-json-schema --save-dev
      
      - name: Build Project
        run: npm run build

      - name: Build And Deploy
        id: builddeploy
        uses: Azure/static-web-apps-deploy@v1
        with:
          azure_static_web_apps_api_token: ${{ secrets. }}
          repo_token: ${{ secrets.GITHUB_TOKEN }}
          action: "upload"
          app_location: "/" 
          api_location: "" 
          output_location: "dist" 

  close_pull_request_job:
    if: github.event_name == 'pull_request' && github.event.action == 'closed'
    runs-on: ubuntu-latest
    name: Close Pull Request Job
    steps:
      - name: Close Pull Request
        id: closepullrequest
        uses: Azure/static-web-apps-deploy@v1
        with:
          azure_static_web_apps_api_token: ${{ secrets. }}
          action: "close"
name: Azure Static Web Apps CI/CD

on:
  push:
    branches:
      - production
  pull_request:
    types: [opened, synchronize, reopened, closed]
    branches:
      - production

jobs:
  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
          lfs: false

      - name: Setup Node.js 22
        uses: actions/setup-node@v4
        with:
          node-version: '22'
      
      - name: Install Dependencies
        run: |
          npm ci
          npm install zod zod-to-json-schema --save-dev
      
      - name: Build Project
        run: npm run build

      - name: Build And Deploy
        id: builddeploy
        uses: Azure/static-web-apps-deploy@v1
        with:
          azure_static_web_apps_api_token: ${{ secrets. }}
          repo_token: ${{ secrets.GITHUB_TOKEN }}
          action: "upload"
          app_location: "/" 
          api_location: "" 
          output_location: "dist" 

  close_pull_request_job:
    if: github.event_name == 'pull_request' && github.event.action == 'closed'
    runs-on: ubuntu-latest
    name: Close Pull Request Job
    steps:
      - name: Close Pull Request
        id: closepullrequest
        uses: Azure/static-web-apps-deploy@v1
        with:
          azure_static_web_apps_api_token: ${{ secrets. }}
          action: "close"
owljacob
owljacob•3mo ago
nitro: {
        azure: {
            config: {
                platform: {
                    apiRuntime: "node:20",
                },
            },
        },
    }
nitro: {
        azure: {
            config: {
                platform: {
                    apiRuntime: "node:20",
                },
            },
        },
    }
@code.73 set this in nuxt config
code
codeOP•3mo ago
I added, still same issue:
No description
No description
owljacob
owljacob•3mo ago
could you try also adding engines to package.json
code
codeOP•3mo ago
Trying atm
owljacob
owljacob•3mo ago
you can use 22 there but for api use (keep) 20 cuz swa doesnt support newer
code
codeOP•3mo ago
Nope 🙁 one sec, different errors now Okay onxy is using 22 now 
Σ Total size: 44.6 MB (16.9 MB gzip)
[warn] [@nuxt/image] `sharp` binaries for `linux-x64` cannot be found. Please report this as a bug with a reproduction at `https://github.com/nuxt/image`.
[success] [nitro] You can preview this build using `npx @azure/static-web-apps-cli start .output/public --api-location .output/server/functions`
Preparing output...

The app build failed to produce artifact folder: 'dist'. Please ensure this property is configured correctly in your workflow file.
Σ Total size: 44.6 MB (16.9 MB gzip)
[warn] [@nuxt/image] `sharp` binaries for `linux-x64` cannot be found. Please report this as a bug with a reproduction at `https://github.com/nuxt/image`.
[success] [nitro] You can preview this build using `npx @azure/static-web-apps-cli start .output/public --api-location .output/server/functions`
Preparing output...

The app build failed to produce artifact folder: 'dist'. Please ensure this property is configured correctly in your workflow file.
Do I just suck it up and not use lazy loading?
owljacob
owljacob•3mo ago
i think you should use different provider anyways because swa got crazy cold starts and your bundle is kinda big but basically it works now, theres just issue with nuxt img
code
codeOP•3mo ago
So I had to change the build and deploy dir from dist to output_location: ".output/public" for it to build since the error The app build failed to produce artifact folder: 'dist'. Please ensure this property is configured correctly in your workflow file. but I'm getting a 404, does nitro use dist or? I had to add: 
          api_location: ".output/server"
          output_location: ".output/public"
          api_location: ".output/server"
          output_location: ".output/public"
Thansk for all your help owl!

Did you find this page helpful?