Deploy Static Webapp with Managed Function

Question

Deploy Static Webapp with Managed Function

Tom Grieme 0

Hey everybody,

I want to deploy my Next.js webapp as static website to azure with one managed function. Locally everything works fine, but Azure always fails to deploy the function without any error, just saying failed to deploy. Maybe anybody here knows why. Lemme know what exactly you need or think what might be the problem. Here is my api directory structure and my github action yml:
User's image

(Instead of .Token I use my actual token name there)

name: Azure Static Web Apps CI/CD

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

env:
  AZURE_FUNCTIONS_ENVIRONMENT: Production
  WEBSITE_NODE_DEFAULT_VERSION: "~20"
  ORYX_NODE_VERSION: "20"

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@v4
        with:
          submodules: true
          lfs: false

      - name: Setup Node.js
        uses: actions/setup-node@v4
        with:
          node-version: "22.18.0"
          cache: "npm"

      - name: Build And Deploy
        id: builddeploy
        uses: Azure/static-web-apps-deploy@v1
        with:
          azure_static_web_apps_api_token: ${{ secrets.TOKEN}}
          repo_token: ${{ secrets.GITHUB_TOKEN }}
          action: "upload"
          app_location: "/"
          api_location: "api"
          output_location: "out"
          skip_api_build: false
          skip_app_build: false
        env:
          IS_STATIC_EXPORT: true
          AZURE_FUNCTIONS_ENVIRONMENT: Production
          WEBSITE_NODE_DEFAULT_VERSION: "~20"
          NEXT_TELEMETRY_DISABLED: 1
          NEXT_BUILD_CACHE: "true"

  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.TOKEN}}
          action: "close"
          app_location: "."

Vimal Lalani 500 Reputation points Microsoft External Staff Moderator

2025-08-28T07:50:26.5866667+00:00
Hi @Tom Grieme

Thank you for posting your question on Q&A.

From your description, it seems you are trying to deploy a Next.js application as a static web app with a managed function, but the deployment through GitHub Actions fails without showing a clear error.

Here are a few points you can check to help troubleshoot this issue:

Since the deployment is running through GitHub Actions, please review the logs to see why the workflow failed. You can do this by navigating to Azure Portal → Static Web App → Overview → Deployment history, then open the failed action in GitHub and check the error messages.

Ensure that the skip_api_build and skip_app_build flags are not set. Removing them can help identify build errors more clearly in the GitHub Actions logs.

Verify that the output_location: "out" folder is correctly generating the release files during the build process.

You may also find it useful to test the setup locally using the Static Web Apps CLI (SWA CLI). This can help reproduce and debug the issue before deploying. Reference: Set up local development with Azure Static Web Apps CLI

Feel free to share back any errors you find in the deployment logs or if you need more assistance in narrowing down the problem.

Tom Grieme 0

Hey,
locally it does work. There is no error, it just tells me Deployment Failed. The webapp deploys if i leave out the function but the function does not deploy. Therefore the out folder is also correct.

--End of Oryx build logs--- Function Runtime Information. OS: linux, Functions Runtime: ~4, node version: 18 Finished building function app with Oryx Zipping Api Artifacts Done Zipping Api Artifacts Zipping App Artifacts Done Zipping App Artifacts Uploading build artifacts. Finished Upload. Polling on deployment. Status: InProgress. Time: 0.2178821(s) Status: Failed. Time: 17.9270468(s) Deployment Failed :( Deployment Failure Reason: Failed to deploy the Azure Functions.

Vimal Lalani 500 Reputation points Microsoft External Staff Moderator

2025-08-28T08:57:32.6033333+00:00
Hi @Tom Grieme

Are you able to successfully deploy the app using Static Web Apps CLI (SWA CLI) as mentioned in step 4?

If yes, then the issue is most likely with the GitHub Actions workflow configuration (for example, api_location, output_location, or build settings).

If no, then it indicates the problem is with the local setup or function configuration, and debugging through SWA CLI logs will help identify the root cause.

Thanks

Vimal
Tom Grieme 0 Reputation points

2025-08-28T09:11:36.5766667+00:00

Hey @Vimal Lalani

No, both ways fail. Both ways only work if just deploying the static webapp. my api_location is fine, it points to my api directory, because it reads the package.json and installs it just then randomly fails.
Vimal Lalani 500 Reputation points Microsoft External Staff Moderator

2025-08-28T10:20:46.6866667+00:00

Hi @Tom Grieme

Thank you for confirming. Since the deployment is failing in both GitHub Actions and SWA CLI, and only succeeds when the API is excluded, it looks like the issue is specifically related to the Azure Functions build or deployment process.

Check in .yaml file with

app_location: "app/" # App source code path which contain .html file

api_location: "api" # Api source code path - optional

Refer: add-api-location-to-workflow
Tom Grieme 0 Reputation points

2025-08-28T11:01:03.3233333+00:00

Hey,
my index.html is in out directory after the build runs, so app location "/" should be fine because I specify out as output_location and api_location is set to my api directory. I have create a seperate azure function in azure portal it does work as well. Thats so strange, I really want it to work as managed function. If I remove skip app and api build, i have to do it manually. I already tried that as well and got the same result and error message

Vimal Lalani 500 Microsoft External Staff Moderator

Hi Tom Grieme

Thank you for the clarification. Since the static app part is working fine and you are able to deploy a standalone Azure Function successfully, the issue is specific to how the managed function is being picked up inside the Static Web App.

For the managed function deployment to succeed, the API folder must follow the Azure Functions app structure. In particular, the following files are required:

api/

host.json

<function-name>/

function.json

index.js
```typical  function.json


```json

{
  "bindings": [
    {
      "authLevel": "anonymous",
      "type": "httpTrigger",
      "direction": "in",
      "name": "req",
      "methods": ["get"]
    },
    {
      "type": "http",
      "direction": "out",
      "name": "res"
    }
  ]
}

and index.js

module.exports = async function (context, req) {   
    context.res = {
         headers: {
            'Access-Control-Allow-Origin': "*",
            'Access-Control-Allow-Methods': 'GET, POST, OPTIONS',
            'Access-Control-Allow-Headers': 'Content-Type, Authorization'
        },
        // status: 200, /* Defaults to 200 */
        body: { "data" : "Hello World from Azure Static Web Apps API!"  }
    };
};

Tom Grieme 0

and the package.json also in the api folder where host.json is, right? I did this, it still fails.
I did a very basic function setup now:
package.json:


{
  "name": "api",
  "version": "1.0.0",
  "description": "",
  "scripts": {
    "start": "func start",
    "test": "echo \"No tests yet...\""
  },
  "dependencies": {
    "@azure/functions": "^4.0.0"
  },
  "devDependencies": {
    "azure-functions-core-tools": "^4.0.5455"
  }
}

function.json (in api/functionName):


{
  "bindings": [
    {
      "authLevel": "anonymous",
      "type": "httpTrigger",
      "direction": "in",
      "name": "req",
      "methods": ["get"]
    },
    {
      "type": "http",
      "direction": "out",
      "name": "res"
    }
  ]
}

index.js (also in api/functionName):

module.exports = async function (context, req) {
  context.res = {
    headers: {
      "Access-Control-Allow-Origin": "*",
      "Access-Control-Allow-Methods": "GET, POST, OPTIONS",
      "Access-Control-Allow-Headers": "Content-Type, Authorization",
    },
    // status: 200, /* Defaults to 200 */
    body: { data: "Hello World from Azure Static Web Apps API!" },
  };
};

host.json in api/

{
  "version": "2.0",
  "logging": {
    "applicationInsights": {
      "samplingSettings": {
        "isEnabled": true,
        "excludedTypes": "Request"
      }
    }
  },
  "extensionBundle": {
    "id": "Microsoft.Azure.Functions.ExtensionBundle",
    "version": "[4.*, 5.0.0)"
  },
  "functionTimeout": "00:10:00"
}

and my github yaml


name: Azure Static Web Apps CI/CD

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

env:
  AZURE_FUNCTIONS_ENVIRONMENT: 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@v4
        with:
          submodules: true
          lfs: false

      - name: Setup Node.js
        uses: actions/setup-node@v4
        with:
          node-version: "20"

      - name: Build And Deploy
        id: builddeploy
        uses: Azure/static-web-apps-deploy@v1
        with:
          azure_static_web_apps_api_token: ${{ secrets.TOKEN}}
          repo_token: ${{ secrets.GITHUB_TOKEN }}
          action: "upload"
          app_location: "/"
          api_location: "api"
          output_location: "out"
          skip_api_build: false
          skip_app_build: false
        env:
          IS_STATIC_EXPORT: true
          AZURE_FUNCTIONS_ENVIRONMENT: Production
          NEXT_TELEMETRY_DISABLED: 1
          NEXT_BUILD_CACHE: "true"

  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.TOKEN}}
          action: "close"
          app_location: "."

The full output is this:

Operation performed by Microsoft Oryx, https://github.com/Microsoft/Oryx
You can report issues at https://github.com/Microsoft/Oryx/issues

Oryx Version: 0.2.20241003.1, Commit: d5352431d933306ccee1be9b5d822c73bf723e9e, ReleaseTagName: 20241003.1

Build Operation ID: dbd5b69d9f28b530
Repository Commit : c4b904b15381f671f8e295815ecc8bafeaf4c75c
OS Type           : bullseye
Image Type        : githubactions

Detecting platforms...
Detected following platforms:
  nodejs: 18.20.8
Version '18.20.8' of platform 'nodejs' is not installed. Generating script to install it...


Source directory     : /github/workspace/api
Destination directory: /bin/staticsites/23ac70ca-3d37-4f80-b55c-7df1d7859eff-swa-oryx/api


Downloading and extracting 'nodejs' version '18.20.8' to '/tmp/oryx/platforms/nodejs/18.20.8'...
Detected image debian flavor: bullseye.
Downloaded in 1 sec(s).
Verifying checksum...
Extracting contents...
performing sha512 checksum for: nodejs...
Done in 3 sec(s).

Removing existing manifest file
Creating directory for command manifest file if it does not exist
Creating a manifest file...
Node Build Command Manifest file created.

Using Node version:
v18.20.8

Using Npm version:
10.8.2

Installing production dependencies in '/github/workspace/api/.oryx_prod_node_modules'...

Running 'npm install --production'...

npm warn config production Use `--omit=dev` instead.

added 5 packages, and audited 6 packages in 1s

found 0 vulnerabilities

Copying production dependencies from '/github/workspace/api/.oryx_prod_node_modules' to '/github/workspace/api/node_modules'...
Done in 0 sec(s).

Running 'npm install'...


added 35 packages, and audited 41 packages in 26s

5 packages are looking for funding
  run `npm fund` for details

found 0 vulnerabilities

Copy '/github/workspace/api/node_modules' with all dependencies to '/github/workspace/api/.oryx_all_node_modules'...

Copying production dependencies from '/github/workspace/api/.oryx_prod_node_modules/node_modules' to '/github/workspace/api/node_modules'...
Preparing output...

Copying files to destination directory '/bin/staticsites/23ac70ca-3d37-4f80-b55c-7df1d7859eff-swa-oryx/api'...
Done in 0 sec(s).

Removing existing manifest file
Creating a manifest file...
Manifest file created.
Copying .ostype to manifest output directory.

Done in 36 sec(s).


---End of Oryx build logs---
Function Runtime Information. OS: linux, Functions Runtime: ~4, node version: 18
Finished building function app with Oryx
Zipping Api Artifacts
Done Zipping Api Artifacts
Zipping App Artifacts
Done Zipping App Artifacts
Uploading build artifacts.
Finished Upload. Polling on deployment.
Status: InProgress. Time: 0.2073188(s)
Status: Failed. Time: 15.5981194(s)
Deployment Failed :(
Deployment Failure Reason: Failed to deploy the Azure Functions.

For further information, please visit the Azure Static Web Apps documentation at https://docs.microsoft.com/en-us/azure/static-web-apps/
If you believe this behavior is unexpected, please raise a GitHub issue at https://github.com/azure/static-web-apps/issues/
Exiting

Tom Grieme 0

Hey @Vimal Lalani ,

I get this error, if i simply try to copy and deploy it to my own webapp, could you share the whole project, so i could clone it for testing? That would be great. Or did you set any env variables in your static webapp?

But thank you very much already

Version '18.20.8' of platform 'nodejs' is not installed. Generating script to install it...
Error: Could not find either 'build' or 'build:azure' node under 'scripts' in package.json. Could not find value for custom run build command using the environment variable key 'RUN_BUILD_COMMAND'.Could not find tools for building monorepos, no 'lerna.json' or 'lage.config.js' files found.


---End of Oryx build logs---
Oryx could not find a 'build' or 'build:azure' script in the package configuration. Please add one of these commands to your package configuration file (i.e. package.json). Alternatively, you can add the app_build_command to the build/deploy section of your workflow file. For example, app_build_command: 'npm run docs:build'

Tom Grieme 0 Reputation points

2025-08-29T11:28:47.0333333+00:00

@Vimal Lalani u saved my life, I made it work. Can I buy u a coffee or something?

Accepted answer

0 additional answers

Your answer

Vimal Lalani 500 Reputation points Microsoft External Staff Moderator

2025-08-28T07:50:26.5866667+00:00

Hi @Tom Grieme

Thank you for posting your question on Q&A.

From your description, it seems you are trying to deploy a Next.js application as a static web app with a managed function, but the deployment through GitHub Actions fails without showing a clear error.

Here are a few points you can check to help troubleshoot this issue:

Since the deployment is running through GitHub Actions, please review the logs to see why the workflow failed. You can do this by navigating to Azure Portal → Static Web App → Overview → Deployment history, then open the failed action in GitHub and check the error messages.

Ensure that the skip_api_build and skip_app_build flags are not set. Removing them can help identify build errors more clearly in the GitHub Actions logs.

Verify that the output_location: "out" folder is correctly generating the release files during the build process.

You may also find it useful to test the setup locally using the Static Web Apps CLI (SWA CLI). This can help reproduce and debug the issue before deploying. Reference: Set up local development with Azure Static Web Apps CLI

Feel free to share back any errors you find in the deployment logs or if you need more assistance in narrowing down the problem.
Tom Grieme 0 Reputation points

2025-08-28T08:34:50.62+00:00

Hey,
locally it does work. There is no error, it just tells me Deployment Failed. The webapp deploys if i leave out the function but the function does not deploy. Therefore the out folder is also correct.

--End of Oryx build logs--- Function Runtime Information. OS: linux, Functions Runtime: ~4, node version: 18 Finished building function app with Oryx Zipping Api Artifacts Done Zipping Api Artifacts Zipping App Artifacts Done Zipping App Artifacts Uploading build artifacts. Finished Upload. Polling on deployment. Status: InProgress. Time: 0.2178821(s) Status: Failed. Time: 17.9270468(s) Deployment Failed :( Deployment Failure Reason: Failed to deploy the Azure Functions.
Vimal Lalani 500 Reputation points Microsoft External Staff Moderator

2025-08-28T08:57:32.6033333+00:00

Hi @Tom Grieme

Are you able to successfully deploy the app using Static Web Apps CLI (SWA CLI) as mentioned in step 4?

If yes, then the issue is most likely with the GitHub Actions workflow configuration (for example, api_location, output_location, or build settings).

If no, then it indicates the problem is with the local setup or function configuration, and debugging through SWA CLI logs will help identify the root cause.

Thanks

Vimal
Tom Grieme 0 Reputation points

2025-08-28T09:11:36.5766667+00:00

Hey @Vimal Lalani

No, both ways fail. Both ways only work if just deploying the static webapp. my api_location is fine, it points to my api directory, because it reads the package.json and installs it just then randomly fails.
Vimal Lalani 500 Reputation points Microsoft External Staff Moderator

2025-08-28T10:20:46.6866667+00:00

Hi @Tom Grieme

Thank you for confirming. Since the deployment is failing in both GitHub Actions and SWA CLI, and only succeeds when the API is excluded, it looks like the issue is specifically related to the Azure Functions build or deployment process.

Check in .yaml file with

app_location: "app/" # App source code path which contain .html file

api_location: "api" # Api source code path - optional

Refer: add-api-location-to-workflow
Tom Grieme 0 Reputation points

2025-08-28T11:01:03.3233333+00:00

Hey,
my index.html is in out directory after the build runs, so app location "/" should be fine because I specify out as output_location and api_location is set to my api directory. I have create a seperate azure function in azure portal it does work as well. Thats so strange, I really want it to work as managed function. If I remove skip app and api build, i have to do it manually. I already tried that as well and got the same result and error message
Vimal Lalani 500 Reputation points Microsoft External Staff Moderator

2025-08-28T11:35:37.33+00:00

Hi Tom Grieme

Thank you for the clarification. Since the static app part is working fine and you are able to deploy a standalone Azure Function successfully, the issue is specific to how the managed function is being picked up inside the Static Web App.

For the managed function deployment to succeed, the API folder must follow the Azure Functions app structure. In particular, the following files are required:

api/

host.json

<function-name>/

function.json index.js ```typical function.json ```json { "bindings": [ { "authLevel": "anonymous", "type": "httpTrigger", "direction": "in", "name": "req", "methods": ["get"] }, { "type": "http", "direction": "out", "name": "res" } ] }

and index.js

module.exports = async function (context, req) { context.res = { headers: { 'Access-Control-Allow-Origin': "*", 'Access-Control-Allow-Methods': 'GET, POST, OPTIONS', 'Access-Control-Allow-Headers': 'Content-Type, Authorization' }, // status: 200, /* Defaults to 200 */ body: { "data" : "Hello World from Azure Static Web Apps API!" } }; };
Tom Grieme 0 Reputation points

2025-08-28T13:18:01.65+00:00

Hey @Vimal Lalani ,

I get this error, if i simply try to copy and deploy it to my own webapp, could you share the whole project, so i could clone it for testing? That would be great. Or did you set any env variables in your static webapp?

But thank you very much already

Version '18.20.8' of platform 'nodejs' is not installed. Generating script to install it... Error: Could not find either 'build' or 'build:azure' node under 'scripts' in package.json. Could not find value for custom run build command using the environment variable key 'RUN_BUILD_COMMAND'.Could not find tools for building monorepos, no 'lerna.json' or 'lage.config.js' files found. ---End of Oryx build logs--- Oryx could not find a 'build' or 'build:azure' script in the package configuration. Please add one of these commands to your package configuration file (i.e. package.json). Alternatively, you can add the app_build_command to the build/deploy section of your workflow file. For example, app_build_command: 'npm run docs:build'
Tom Grieme 0 Reputation points

2025-08-29T11:28:47.0333333+00:00

@Vimal Lalani u saved my life, I made it work. Can I buy u a coffee or something?

Answer 1

Hi @Tom Grieme

I would like to share a working sample for reference. This project uses the same configuration and successfully deploys a managed function with a Static Web App.

Sample Code (GitHub): hello-static-api

Working URL:https://labvlalani.com/

What this sample demonstrates:

Proper API folder structure compatible with Static Web Apps
Each function in its own subfolder with function.json (HTTP trigger) and index.js

Hopefully reviewing this working setup side by side with your project will help identify what is missing or misconfigured in your repo.

Share via

Deploy Static Webapp with Managed Function

0 additional answers

Your answer