5

Currently I am developing a react application. I have created a .env file and am using the environment variables in all other pages but am not able to see the .env file in the build folder. Is there any way to change the environment variables at run time in the build file?

This will work when changing the hostname and port, etc. manually and then cresting the build. Is there any way to change the variables after creation of the build?

Any help will appropriated.

Thanks, Riya

Improve this question
4
  • .env file looks like below: REACT_APP_HostName=ps-RTDdevXE1 REACT_APP_Port=8080 REACT_APP_BackendName =backendConnect-v1 upload.js (used in upload.js page for backend call): const hostName = ${process.env.REACT_APP_HostName} const port = ${process.env.REACT_APP_Port} const backendName = ${process.env.REACT_APP_BackendName}` Commented Dec 27, 2018 at 21:01
  • You can make .env.development and .env.production if you are using create-react-app Commented Dec 27, 2018 at 21:39
  • Here you go: facebook.github.io/create-react-app/docs/… Commented Dec 27, 2018 at 21:43
  • The .env file doesn't get copied to the build folder. The assumption is that you willl create one in your prod environment, and it lives there (not in your dev environment). This is an important security fesature, because you don't want to store production env settings in your git repo Commented Dec 28, 2018 at 4:42

1 Answer 1

Reset to default
1

The answer to your question can be found here:
Create React App Docs: Adding Custom Environment Variables

The environment variables are embedded during the build time. Since Create React App produces a static HTML/CSS/JS bundle, it can’t possibly read them at runtime. To read them at runtime, you would need to load HTML into memory on the server and replace placeholders in runtime, just like described here. Alternatively you can rebuild the app on the server anytime you change them.

Improve this answer
Sign up to request clarification or add additional context in comments.

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.