Search code examples
reactjsdotenv

Dotenv facing issue (like undefine )


enter image description here

undefined 'value'

.env file
REACT_TEST="Test value"

i am Facing issue with undefined value in ReactJS

function App() {
  const localstorege = () => {
    if (localStorage.getItem("auth")) return true;
    else return false;
  };
  console.log(process.env.REACT_TEST, "value");
  console.log(localstorege(), "local ");
  return (
    <>
      <BrowserRouter>
        <Routes>
          <Route path="/" element={<Login />} />
          <Route element={<PrivateOutlet user={localstorege()} />}>
            <Route path="/dashboard" element={<Dashborad />} />
          </Route>
        </Routes>
      </BrowserRouter>
    </>
  );
}
REACT_TEST="Test value"

Solution

  • Three things to note here

    the variable must be prefixed with REACT_APP_

    eg: REACT_APP_TEST=hello

    You need to restart the server to reflect the changes.

    Make sure you have the .env file in your root folder(same place where you have your package.json) and NOT in your src folder.

    After that you can access the variable like this process.env.REACT_APP_TEST