Railway•11mo ago

Vite Env variables is undefined for react project

I am using Vite + React for my FE. On my local I am using .env to add VITE_API_URL that can be accessed like import.meta.env.VITE_API_URL so that I can make API request but upon viewing in the network tab I can see that it is undefined. I added the variable in railway from the Variables tab. Also I am using serve to serve the build files. Below are the scripts in my package.json

"scripts": {
    "build": "vite build",
    "dev": "vite",
    "preview": "vite preview",
    "start": "serve dist -s -n -L -p $PORT"
  }

"scripts": {
    "build": "vite build",
    "dev": "vite",
    "preview": "vite preview",
    "start": "serve dist -s -n -L -p $PORT"
  }

14 Replies

Percy•11mo ago

Project ID: ed9d81eb-a192-462c-8cf6-bf7778244e57

Percy•11mo ago

Project ID: ed9d81eb-a192-462c-8cf6-bf7778244e57

KeshariPiyush24OP•11mo ago

ed9d81eb-a192-462c-8cf6-bf7778244e57

Fragly•11mo ago

so you're uploading a .env file to railway?

KeshariPiyush24OP•11mo ago

no not uploading but using the variable section from railway dashboard

Fragly•11mo ago

oh okay I'm personally not sure what's wrong here since I don't use Vite or React so let's wait for someone who knows to step in

KeshariPiyush24OP•11mo ago

Okay

KeshariPiyush24OP•11mo ago

I have added my variable here then why is it undefined?

KeshariPiyush24OP•11mo ago

@Brody could you please help?

Fragly•11mo ago

( #🛂｜readme #5 )

maddsua•11mo ago

Could it be possible that the variable is not accessible during build stage thonk

KeshariPiyush24OP•11mo ago

Noted Anyways I was able to solve this issue. I was using docker but I saw other post where it was metioned to use nixpacks instead of docker so I removed the dockerfile and added dependency from VITE + React template and it worked.

Fragly•11mo ago

I'm glad to hear that 🔥 Sorry that I couldn't be of more help glad you figured it out :)

KeshariPiyush24OP•11mo ago

No issues, thanks anyways

Gaming

Programming

Vite Env variables is undefined for react project