I have a react application which reads a couple of API related environmental variables.

1. When running off a local machine or a VM, the API variables are read correctly into the application.
2. When hardcoded into the react application itself, the application runs too.

However, creating a pod in Kubernetes with the image and a configmap does not work - the application runs but the environmental variables are not set.

pod.yaml

...
 spec:
      containers:
      - command:
        - sleep
        - "3600"
        envFrom:
        - configMapRef:
            name: configmap
        image: xxxxx
        imagePullPolicy: IfNotPresent
...

configmap

apiVersion: v1
data:
  API_HOST: xxxxxxx
  SOME_ID: abcdef
  NODE_ENV: development
  PROVIDER: GCP
kind: ConfigMap
metadata:
  creationTimestamp: xxxx
  name: configmap
  namespace: xxxx
  resourceVersion: xxxx
  selfLink: xxxx
  uid: xxxx

React snippet

    if(!process.env.SOME_ID) {
      console.log('ID')
    }

My trouble lies with passing the environmental variables to the React application. I am certain the environmental variables are setup correctly in the pods but seemingly, the client-side React application does not have these variables (i.e. console.log prints nothing).

I chanced upon this article doing something similar but with Docker. It mentions that the transpiling replaces all process.env with a string value. The trick given to mitigate this bash script which creates JavaScript file with environment variables assigned as properties of the global window object.

While I am unsure if this is doable in Kubernetes, I am wonder is there an easier way to inject environmental variables of a Kubernetes pod into a react application at runtime?