Azure Static Web App NodeJS env variables

Question

I'm using Azure Static Web App service and Azure DevOps pipeline to deploy a NodeJS app. The pipeline and the build are going well. Now i have to define a URL for the backend using env variables, but without success.

trigger:
- develop

jobs:
  - job: JobTest
    pool:
      vmImage: ubuntu-latest

    variables:
    - name: BACKEND_URL
      value: https://
    - name: System.Debug
      value: true
    steps:
    - task: AzureStaticWebApp@0
      inputs:
        app_location: "/" 
        api_location: ""
        output_location: "dist"

      env:
        BACKEND_URL: $(BACKEND_URL)
        azure_static_web_apps_api_token: $(deployment_token)
    - bash: echo $(BACKEND_URL)
    - bash: echo $PWD

and from the NodeJS code, in the "/app/src/models/config.ts" file i have the this:

export const BACKEND_URL = process.env.BACKEND_URL

If i change process.env.BACKEND_URL with the actual URL it will work.

Also, from the Azure Pipeline this task is using the https://github.com/microsoft/Oryx build system.

The question is how can i use env from the pipeline in the code?

user_13586071 · Answer

Static Web App cannot use back end variables.

You could consider using .env file to config your environment variables. Format like "name=value"(without quotes).

And install dotenv in the file you want to invoke the environment variables, access them by process.env.

Have a look at this article: Node.js Environment Variable Configuration by using env file

And my another answer: https://stackoverflow.com/a/67052708/13586071

user_12450747 · Answer

To help improve this issue, I have added an answer:

the env variables cannot be used azure pipeline with azure Static Web App. And here is a ticket which reports the issue.

Azure Static Web App NodeJS env variables

2 Answers