dotenv-webpack enviornment variables not working on Github actions

user_14397986 0
Viewed 508

I'm using dotenv-webpack to set up the enviornment varibles from webpack. And push my code build to S3 then. I set up .env file on my local with APP_BASE = http://localhost:3000 inside .env.

I have created the github action workflow.yml:

name: React CI

on:
    push:
        branches:
            - "main"

jobs:
    build:
        runs-on: ubuntu-latest

        strategy:
            matrix:
                node-version: [15.x]

        steps:
            - uses: actions/checkout@v1
            - run: npm install
            - run: npm run build
            - uses: jakejarvis/s3-sync-action@master
              with:
                  args: --acl public-read --follow-symlinks --delete
              env:
                  AWS_S3_BUCKET: ${{ secrets.AWS_S3_BUCKET }}
                  AWS_ACCESS_KEY_ID: ${{ secrets.AWS_ACCESS_KEY_ID }}
                  AWS_SECRET_ACCESS_KEY: ${{ secrets.AWS_SECRET_ACCESS_KEY }}
                  AWS_REGION: "ap-southeast-2"
                  SOURCE_DIR: "dist"
                  APP_BASE: ${{ secrets.APP_BASE }}

On my github actions secrets, I have added the secrets:

enter image description here

on webpack settings, I have set systemvars: true:

plugins: [
        new Dotenv({
            systemvars: true,
        }),

It's working on my localhost.

I didn't commit .env file to my repository, and when I push code to github, github console output: Failed to load ./.env..

enter image description here

When I check the compiled file, it shows var e="MISSING_ENV_VAR".APP_BASE;. That means github action didn't catch the APP_BASE on the secrets.

How can I fix this issue?

dotenv github-actions webpack reactjs environment-variables
2 Answers

One possibility is comitting .env to your repo with values suitable for local dev and containing no real secrets. Then put all your secrets in GitHub and when CI runs the local dev values will be overwritten by the ones in GitHub secrets via the systemvars setting.

user_2581740

I found the error, I should move the env varible to the higher level as the current one I put is for task on S3, not for build.

name: React CI

on:
    push:
        branches:
            - "main"

env:
    APP_BASE: ${{ secrets.APP_BASE }}

jobs:
    build:
        runs-on: ubuntu-latest

        strategy:
            matrix:
                node-version: [15.x]

        steps:
            - uses: actions/checkout@v1
            - run: npm install
            - run: npm run build
            - uses: jakejarvis/s3-sync-action@master
              with:
                  args: --acl public-read --follow-symlinks --delete
              env:
                  AWS_S3_BUCKET: ${{ secrets.AWS_S3_BUCKET }}
                  AWS_ACCESS_KEY_ID: ${{ secrets.AWS_ACCESS_KEY_ID }}
                  AWS_SECRET_ACCESS_KEY: ${{ secrets.AWS_SECRET_ACCESS_KEY }}
                  AWS_REGION: "ap-southeast-2"
                  SOURCE_DIR: "dist"
user_143979860
Related