Render is not reading 'process.env.BACKEND_BASE_URL' from environment variables and my request url is always wrong

1

Hi Render,

Problem Statement
I have deployed a web service and added the backend url to frontend’s environment variables but for some reason the frontend can’t read it properly.

Some Context
I have frontend code:

import axios from "axios";

const baseURL =
  process.env.NODE_ENV === "development"
    ? "http://localhost:7000"
    : process.env.BACKEND_BASE_URL;

 const api = axios.create({
  baseURL,
});

And I added BACKEND_BASE_URL to my static site’s environment variables in Render.

render-envir-v
render-envir-v2084×390 28.9 KB

I have double checked my branch is correct and deployed latest commit successfully. But request base url turned out to be the frontend url instead of what I defined in environment variables.

I found it super weird and have been struggling for hours… Can anyone help? Thanks a lot!

2

Solved. Environment variables need REACT_APP_ as prefix to work for React.

3

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.