'Environment variables are getting fetched after build deploy to S3 is Vuejs

I have used Github Actions to build and deploy the Vue app to the S3 bucket. The problem is, the build script cannot fetch ENV from the .env or .env.production files, as those are not added in the commit.

I'm getting undefined when I log the ENV variables in my created() hook. As there are only two that are available, but the ones I wanted:

.env & .env.production as of now exactly the same:

VUE_APP_RZ_KEY=<Secret_Key>
VUE_APP_API_URL=<API_URL>

package.json

{
  "name": "my_app",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "serve": "npm run lint && vue-cli-service serve",
    "serve:prod": "npm run lint && vue-cli-service serve --production",
    "build": "vue-cli-service build --mode production",
    "test:e2e": "vue-cli-service test:e2e",
    "lint": "vue-cli-service lint --fix"
  },
  "dependencies": {
    "axios": "^0.21.1",
    "vue": "^2.6.11",
    "vue-axios": "^3.2.5",
    "vue-router": "^3.2.0"
  },
...
}

Github Action .yaml file:

How do I make my ENVs make it to the built?

Solution 1:^[1]

I propose to add the end data to GitHub Secrets.

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution	Source
Solution 1	Yunnosch

'Environment variables are getting fetched after build deploy to S3 is Vuejs

Solution 1:[1]

Sources

Related Questions

Solution 1:^[1]