Error library

Error: supabaseUrl is required. (Vite env var missing VITE_ prefix, blank screen in production)

supabase-js throws this when the URL it receives is empty, usually because Vite only exposes VITE_-prefixed environment variables to client code: SUPABASE_URL becomes undefined in the browser and the app can crash to a blank screen. Rename the variable to VITE_SUPABASE_URL, read it via import.meta.env.VITE_SUPABASE_URL, set it on your host, and rebuild.

Cause: The variable is missing the VITE_ prefix (or was not set at build time), so Vite never inlines it into the bundle.

How to fix it

  1. Rename client-side variables to start with VITE_ in .env and in your host's dashboard.
  2. Read them with import.meta.env.VITE_*, not process.env.
  3. Remember values are inlined at build time: set them before the build, then redeploy.
  4. Only expose public values (e.g. Supabase anon key). Never prefix server secrets with VITE_; anything VITE_ ships to the browser.

Example

Illustrative example, not from a customer project.

- SUPABASE_URL=https://xyz.supabase.co
+ VITE_SUPABASE_URL=https://xyz.supabase.co

- const url = process.env.SUPABASE_URL
+ const url = import.meta.env.VITE_SUPABASE_URL

FAQ

Why does it work locally but not in production?

Your local .env is read at dev time; the production build only gets variables set in the host's build environment, and only VITE_-prefixed ones reach the client.

Can I put my Stripe secret key in a VITE_ variable?

No. Every VITE_ variable is embedded in the public JavaScript bundle. Keep secrets on the server.

Get a $149 diagnosis See pricing Launching soon? The Launch Path gets you ready for $1,195 flat.

$149Get a $149 diagnosis