Unable to access environment variables

Troubleshooting and help
,
1

Hello support team,
I have a vue 3 + typescript based app that is not able to access the environment variables, there is no error, just that they come up as undefined. I have tried accessing the secrets and they too come up as undefined. There is no error during the deployment process in the logs. Everything works fine on local. Also when i push an .env file my app is able to fetch/access the values from the .env file.

2

Hi!

Can you share your Dockerfile, please?

3

Hello,
Sure.
Dockerfile

# build stage
FROM node:lts-alpine as build-stage

# Set the working directory inside the container
WORKDIR /app

# Copy the package.json and package-lock.json files
COPY package*.json ./

# Install dependencies
RUN npm install --legacy-peer-deps

COPY . .

# Build the Vue.js app for production
RUN npm run build

# production stage
FROM nginx:stable-alpine as production-stage

# Copy the build output to the Nginx HTML directory
COPY --from=build-stage /app/dist /usr/share/nginx/html

# Copy the custom Nginx configuration file
COPY nginx.conf /etc/nginx/nginx.conf

# Expose port 80 to the outside world
EXPOSE 80

# Command to run Nginx
CMD ["nginx", "-g", "daemon off;"]

And docker-compose.yml

version: '3.8'

services:

  frontend:
    build:
      context: .
      dockerfile: Dockerfile
    ports:
      - "8080:80"
    environment:
      - VUE_APP_API_TARGET=http://web:3000/graphql
    networks:
      - app-network

networks:
  app-network:
    external: true
4

Could you try to delete the secret and create it again?

5

the secret variable on koyeb?

6

deleted and created the secrets again, and it didn’t work.

7

Did you check in the service console? The environment variables seem to receive the secret value.

When do you try to access this environment variable?

8

This is my first time with koyeb so i don’t know how to use the service console.
The env contain the path for api calls and some public keys, and i access them using this format process.env.<env-name> or process.env.VUE_APP_API_TARGET. I call them when i make api calls to my back-end.

9

Hey @Hamza_Irfan sorry about that.

Looking at your Dockerfile, it seems that you are building assets that are then served from nginx to a client (a web browser). If you want to access content of process.env I think that you need to make the app being run by node on the backend.

10

Hi @Leonardo_Barcaroli,
My backend service is in rails.
I modified the dockerfile to use node instead of nginx, but still no luck.

11

Hello @Hamza_Irfan,

To use environment variables when building your app from a Dockerfile, you need to forward them from the build args. It can be achieved by adding these lines before building the app.

ARG VITE_MY_VARIABLE
ENV VITE_MY_VARIABLE $VITE_MY_VARIABLE

Here is an example. Take a look at this part of the documentation for more details.

Hope this helps, let us know how it goes.

12

I have the same issue - Suddenly none of the 32 environment variables I have configured with my dev environment is included at build.

Using Github as source - Buildpack. Build fails because of variables such as NODE_ENV and DATABASE_URL is not set. I have made no changes to the config nor the project in regards that it would affect environment variables

13

Hello @nils
Your solution worked, the env are set if i include them in the dockerfile, but i have two concerns with this.
FIrst is that is there a way to declare these variables somewhere else and fetch them during the build process because i have few variables at the moment, but they will increase in the future and the dockerfile would get filled with these vars and their declarations?

I tried this approach

COPY env.list /tmp/env.list
ENV $(cat /tmp/env.list | xargs -d '\n')

To restore the env in env.list file and copy it into the docker image so it can be used during build process but it stopped picking the variables again.

I also tried

ARG ENV_FILE=env.list
ENV $(cat $ENV_FILE | xargs)

to just fetch the env list during the docker build process, but this also failed to fetch the env values.

Is there any solution to achieve this?
Also, i have a backend app in rails also on koyeb, and it also uses the dockerfile build but it doesn’t face this issue.

14

Today it’s working :+1: Thank you