How to pass environment variable to Create React App (CRA) ?

Arghya Saha -

The TLDR Answer:

You need to start the variable name with REACT_APP_ . From the official documentation, you can read more.

Your project can consume variables declared in your environment as if they were declared locally in your JS files. By default you will have NODE_ENV defined for you, and any other environment variables starting with REACT_APP_.

You need to add environment details in a file .env in the parent level of the project. You can have different files to override settings as per the environment. Here is the type of environments you can create and how they are being accessed as per the priority. You can read more from the official documentation.

  • .env: Default.
  • .env.local: Local overrides. This file is loaded for all environments except the test.
  • .env.development, .env.test, .env.production: Environment-specific settings.
  • .env.development.local, .env.test.local, .env.production.local: Local overrides of environment-specific settings.