1

I am developing a UI application using MarkLogic Grove(React). And I want to use different settings in the application depending on the environment. For that, I want to use environment variables.

I wrote as follows.

  • ui/src/.env
    TEST="test01"
  • ui/src/App.js
    const valueFromEnv = process.env.TEST;   
    const App = appProps => (
      <AppContainer
        {...appProps}
        render={props => (
          <div> x{valueFromEnv}y
      …

But, "test01" was not displayed on the browser(Only "xy" was displayed.). How do I make environment variables available in Grove?

masaru.uemura
  • 61
  • 2

1 Answers1

0

You need to prefix any env variable you'd like to expose with REACT_APP_, otherwise they won't be exposed inside your frontend code. It is explained in more detail here:

https://create-react-app.dev/docs/adding-custom-environment-variables/

HTH!

grtjn
  • 20,254
  • 1
  • 24
  • 35
  • I renamed the environment variable to REACT_APP_TEST, but it didn't resolve the issue. Does MarkLogic Grove require special settings to use environment variables? – masaru.uemura Oct 30 '20 at 08:58
  • Keep in mind that you then have to access it with process.env.REACT_APP_TEST. It is regular React app behavior, nothing Grove specific. – grtjn Oct 30 '20 at 13:15
  • Oh.. it may help to put that .env one folder higher, not in ui/src/, but in ui/.. – grtjn Oct 30 '20 at 13:35