A Vite env variable reads as undefined

You read import.meta.env.VITE_API_URL and get undefined, even though the value sits right there in your .env file.

BeginnerRead 3 minDoing: 15 minutes5 steps

▶ Start

What you'll have at the end

A working fetch call that reads its address from import.meta.env.VITE_API_URL, logged correctly in the console

Before you start

You need

A Vite dev server already running, and a fetch call somewhere in the project that builds its request address from a value read out of Vite's client-side environment object.

Not covered

Passing a real secret or API key through this same variable, since anything carrying the required prefix ships as plain, readable text in the browser bundle.

Leans on

5 steps

Where to go next

Point Vite's dev proxy at a real backend API

when the actual goal is dodging a CORS error against a real backend during development rather than reading a stored address, a dev-time proxy replaces this env variable entirely.

Checked 21 Aug 2026

Part of the Vite cookbook