1

I am trying to set some environment variables in a powershell (and bash) script and read them in a ReactJS application. The shell script is simple:

$env:AUTHDOMAIN="some.domain.com"
$env:AUTHCLIENTID="bunch-o-characters"
$env:AUTHCALLBACK="http://somewhere:3002/callback"
$env:AUTHAUDIENCE="auth-audience"

$env:PORT=3002

# Get-ChildItem Env:

yarn start

The port is being picked up correctly by yarn but none of the variables (including PORT) are available via process.env within the React javascript. 

console.log("domain     : " + process.env.AUTHDOMAIN);
...
domain     : undefined App.js:33

No mods to my package.json file:

  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },

What am I missing? Get-ChildItem shows that the variables are set correctly in the environment.

Edit: I tried the solution listed here and it doesn't work. It also blocks the terminal from receiving any output:

$ ($env:AUTHDOMAIN="some.domain.com") -and (yarn start)

Same result.

Edit #2: It's worth noting that the behavior is exactly the same in linux/bash (which is a good litmus test cuz I've done this in bash about a 100 billion times) - yarn sets the port correctly but none of the info makes it into the react app:

#!/bin/sh

export AUTHDOMAIN="some.domain.com"
export AUTHCLIENTID="bunch-o-text"
export AUTHCALLBACK="http://somewhere:3001/callback"
export AUTHAUDIENCE="auth-audience"

export PORT=3002

yarn start

So this likely has nothing to do with powershell.

tk421
  • 5,288
  • 6
  • 22
  • 32
Omortis
  • 978
  • 11
  • 32
  • Is this just an issue of context? If you set the variables in the system context instead of current user, do you get a different result? – AdminOfThings Apr 13 '19 at 14:26
  • Do you mean via `[Environment]::SetEnvironmentVariable()`? I'd rather not do that. For the record I do this exact same thing to load env vars into the golang api and the api sees them just fine. – Omortis Apr 13 '19 at 14:33
  • The env variables do in fact persist in the environment after I kill the server which is kind of vexing. – Omortis Apr 13 '19 at 14:37
  • You need to reload the process shell to load the environment changes, see e.g.: https://stackoverflow.com/q/171588/1701026 – iRon Apr 13 '19 at 15:32
  • @iRon I don't think any of that applies. This is powershell not cmd.exe, the env vars are definitely getting set (as shown by Get-ChildItem) and this same setup works fine with a golang application that uses environment variables. I don't want the vars to be system wide, just local to the script process. – Omortis Apr 13 '19 at 16:51

1 Answers1

3

Every environment variable you wish to consume must be prefixed with REACT_APP_ as per the documentation of create-react-app:

Note: You must create custom environment variables beginning with REACT_APP_. Any other variables except NODE_ENV will be ignored to avoid accidentally exposing a private key on the machine that could have the same name. Changing any environment variables will require you to restart the development server if it is running.

Dor Shinar
  • 1,236
  • 10
  • 15