import.meta.env in production: what Vite actually ships

Static replacement, not runtime lookup: understand exactly which values survive a Vite build, then verify yours free.

2026-08-234 min read

The mental model that leaks secrets is “env vars live on servers”. Vite’s model is substitution: prefixed references become literals during build, full stop.

What survives, what customizes the rule, and how to inspect truth.

The mechanism, precisely

Resolution happens against loaded .env files at build invocation:

Vite loads env files matching mode (.env, .env.production, …).
Only VITE_-prefixed names enter import.meta.env.
References compile to literals — object access patterns included.
envPrefix customization can widen or rename the published family.

console.log(import.meta.env.VITE_BUILD); // reference

console.log("production"); // after substitution

Substitution is static and total: the literal replaces the reference everywhere the prefixed name appears, in every chunk, before anything is minified. Obfuscation changes what the string looks like; it does not change who can read it.

Variations of this mistake

define() injecting additional constants.
Custom envPrefix exposing legacy names.
Runtime fallbacks reading undefined — silently empty rather than safe.

Where the value belongs instead

Anything sensitive belongs behind serverless functions or an API gateway; Vite offers no runtime secrecy because it offers no runtime environment.

Verify what your build actually ships

Search the deployed JavaScript for import.meta.env in DevTools — thirty seconds, no tools beyond the browser. What you find is ground truth; everything earlier in the pipeline is intent.

The faster path is to let a machine do the fetching. KeyDrift downloads the same JavaScript a visitor gets — HTML, every referenced chunk including ones named only in the route manifest, and the server-streamed data frameworks inline into the document — and reports credentials with a masked prefix, a fingerprint, and the exact file they live in. Paste your deployed URL into the scanner; no account needed.

Why snapshots are not enough

It bears saying because it happens constantly: the fix holds until the next prompt that needs the query to return rows. Drift monitoring exists for precisely this — it diffs consecutive scans and pages you when a previously resolved finding reappears, naming the regression as a regression rather than repeating the first alert.

The bigger picture

Zoom out and the pattern is bigger than one repo. AI-assisted output has outgrown review capacity everywhere at once, which means thousands of teams are making the same reasonable-looking tradeoffs in the same week. Nobody using modern tooling is uniquely exposed. The failure mode documented above is the modal outcome of velocity without verification, not evidence of carelessness.

How KeyDrift reports this exact finding

Report anatomy matters during incidents, so it is worth reading once calmly: masked string (never the live value — it ceases to exist outside the detection engine), salted fingerprint (trackable within your workspace, useless to strangers), chunk path (your starting point for a "git log -S" hunt), disposition (secret versus public-by-design), confidence (matches below 0.5 never reach the page at all).

Manual check, step by step

The full manual drill, for readers who want zero dependence on any tool: open the deployed site in a private window; launch DevTools → Sources; use Search-all-files (Ctrl/Cmd+Shift+F) for import.meta.env; then repeat for the other marker families — eyJ, sk_live_, sk-proj-, AKIA, postgres, BEGIN PRIVATE KEY. Decode anything JWT-shaped before reacting, and classify public-by-design formats as expected guests rather than intruders.

Close the loop with monitoring

If you take one operational step from this page, make it this: put the URL under continuous monitoring (free tier covers one project daily). The first scan tells you whether you have a problem today; the schedule tells you whether the problem comes back next month after someone re-adds the convenient line.

What the plans change

Free $0 — 1 project · daily scans · email alerts · findings always visible.
Indie $29/mo — 3 projects · hourly · Slack added · 80 chunks per scan.
Team $89/mo — 15 projects · every 15 minutes · Discord + webhooks · 150 chunks.
Growth — from $249/mo, quoted display-only until checkout ships.

The constant across every tier: plans limit how much is watched, never what a scan found. Visibility is structural, not promotional — asserted by tests over the entitlements model itself.

Common questions

Does SSR mode change this?

Server modules stay server-side; shared modules follow their importers. Boundary = import graph.

Can I read unprefixed vars client-side?

Not through import.meta.env — by design. Workarounds reintroduce risk.

Run a free scan at keydrift.dev/scan — paste a URL or the bundle source itself, no account. Findings arrive masked, with the exact chunk they live in.