Based on my understanding of your scenario description, you have tried 3 approaches to set environment variables in Azure App Service for react app.
If you are building for production to generate the
/build locally and then deploying with the
/build folder to Azure, verify that the environment variables are accessible in your local environment so they are injected during build time.
Kindly checkout this doc section for the steps : Environment variables are missing after deployment. - Also, checkout note - For more information on how React uses and expects environment variables.
Just to highlight, also add
MY_ENV_VAR. The variable can be accessed using
Find this sample at https://github.com/Azure-Samples/js-e2e-web-app-server-auth/blob/main/appSettings.js for alternative approach.
Also, checkout this discussion thread: https://stackoverflow.com/a/75208784/8194837
If you're still having issues with passing environment variables to your app, please provide more details about the error message or exact behavior you're experiencing.