Passing env variables in GitHub actions

[rahul-sharma-nyz]

Hi,

I am using GitHub actions for CI/CD for my CRA.

// App.js
import React from 'react';
...
const secret = process.env.REACT_APP_MY_SECRET;
...

This works well on local but fails the CI/CD because the secret variable is not found.
How do I pass env variables in GitHub actions?

[eddiemonge]

I found this result by Googleing github actions environment variables: https://help.github.com/en/actions/configuring-and-managing-workflows/using-environment-variables

Also see @rahul-sharma-nyz comment about keeping the secret from being exposed.

[trdp30]

Thanks @eddiemonge.

[rahul-sharma-nyz]

For future readers, if you don't want to expose your secret in the workflows/*.yml file, you should store it as GitHub secret token and then import it as:

steps:
  - name: Hello world
    run: echo Hello world $FIRST_NAME $middle_name $Last_Name!
    env:
      REACT_APP_MY_SECRET: ${{ secrets.MY_SECRET }}

[trdp30]

Thanks @rahul-rxr, I was in the confusion for defining the variable.

[justinfarrelldev]

Thank you, you're a lifesaver @rahul-rxr!

[ITurres]

Hey @eddiemonge and @rahul-sharma-nyz, it's been nearly four years since you guys kicked off this discussion, and I must say, the insights shared have been invaluable to me and my team! 🚀 Thank you both so much for your contributions! 🙌

[r3ing]

@rahul-sharma-nyz
I had the same problem deploying on firebase hosting, and I found the solution in the following documentation
https://create-react-app.dev/docs/adding-custom-environment-variables, I was able to solve it this way:
..............................

- name: Install 
  run: npm install
- name: Build
  run: REACT_APP_ANYNAME=${{secrets.ANYNAME}} 
         REACT_APP_ANYNAME=${{ secrets.ANYNAME}}
         REACT_APP_ANYNAME=${{secrets.ANYNAME}} npm run build