My solidstart app just hangs if I use process.env on any place

I'm having weird problems with my solid start app, like the page loads, no error from the terminal or browser, but it was like the javascript code does not run at all, no logic is executed, for example: I have a login page with two fields, and use @felte/solid for validations and initial values, everything works until I import the following file on any of my files: import { z } from 'zod'; const schema = z.object({ API_BASE_URL: z.string().url(), }) const target = process.env export const environment = schema.parse(target) console.log(environment) I can see the log in my console with my env variables, but the app is not working on browser (the initial values for the form are not set for fields, no validation, no submit, etc.), the very moment I replace process.env with a plain js object like { API_BASE_URL: "http://localhost:3000" } the app works as expected, what could be the problem?
1 Reply
peerreynders
peerreynders2mo ago
but the app is not working on browser
That's not surprising given that process.env doesn't exist on the browser. Try import.meta.env.VITE_API_BASE_URL instead (i.e. use VITE_API_BASE_URL instead of API_BASE_URL to expose it to both the server and the browser). However vinxi doesn't support every vite configuration option.
GitHub
How to do conditional vite config depending on mode (i.e. dev or pr...
In pre-beta2, we can still use this https://vitejs.dev/config/#conditional-config where defineConfig can accept a function that has mode that determine development or production. However in beta-2,...
vitejs
Env Variables and Modes
Next Generation Frontend Tooling

Did you find this page helpful?