Problem on adding ENV var in Netlify for react app

Question

I'm facing a problem on adding env var in netlifiy for react app.But it works perfect on localhost. Here is the code

let appId;

if (process.env.NODE_ENV !== "production") {
  appId = process.env.REACT_APP_SPEECH_ID;
} else {
  appId = process.env.SPEECH_ID;
}
export default appId;

The error I'm facing is

I'm adding the Netlify settings also

I can't figure out what's happening here. Please help me. Thanks in advance :)

Answer 1

I believe Create React App requires your environment variables to be prefixed with REACT_APP_, similar to how you've done for localhost. I'd keep it the same for production:

const appId = process.env.REACT_APP_SPEECH_ID;

export default appId;

And then rename the variable in the Netlify admin as REACT_APP_SPEECH_ID.