process is not defined

Browser code used process, a Node.js global that browsers don’t have, usually to read an environment variable the Node.js way.

Browser console
Uncaught ReferenceError: process is not defined

Also appears as

  • ReferenceError: Can't find variable: process
  • Uncaught ReferenceError: global is not defined
  • Uncaught ReferenceError: Buffer is not defined

Prompt to fix it

My Vite app crashes in the browser with "ReferenceError: process is not defined". Find every process.env read in browser code and replace it with import.meta.env. Rename those variables to start with VITE_ in .env and in our host’s settings, and use import.meta.env.MODE, DEV, or PROD where the code checks process.env.NODE_ENV. If a secret key is involved, move that call into a server route instead of exposing it. If the error comes from a package in node_modules, tell me which one and suggest a browser-friendly version. Don’t define a fake process global or add Node.js polyfills to hide it.

Paste into Layerwise or any AI coding tool.

What it means

process is a global object that Node.js provides on servers, and process.env is where Node.js keeps environment variables. Browsers have no process, so code in the page that touches it throws this error. Next.js adds a small process to its browser bundles, which is why code from a Next.js or Create React App project breaks when it moves to Vite.

Vite exposes environment variables on import.meta.env, and only the ones whose names start with VITE_. Its dev server replaces process.env.NODE_ENV and nothing else, so any other process.env read crashes there.

A production build behaves differently, and that’s the trap. Vite swaps process.env for an empty object, so process.env.API_URL stops crashing and quietly becomes undefined. The error disappears after you deploy, and the feature that needed the value breaks without a message.

Common causes

  • Code written for Next.js or Create React App reads process.env.REACT_APP_API_URL or process.env.NEXT_PUBLIC_… inside a Vite app.
  • An AI tool read an API URL or key the Node.js way inside a React component.
  • A package written for Node.js uses process, global, or Buffer, and it was bundled into browser code.
  • Server-only code, such as a database client, is imported into a component that runs in the browser.

How to fix it

  1. Open the file and line from the stack trace, and check whether it’s your code or a file inside node_modules.
  2. In your code, replace process.env.API_URL with import.meta.env.VITE_API_URL, and rename the variable in .env and on your host so it starts with VITE_.
  3. Keep secrets out of VITE_ variables, because Vite copies them into JavaScript anyone can download. Move calls that need a secret key into a server route.
  4. Replace process.env.NODE_ENV with import.meta.env.MODE, or use import.meta.env.DEV and import.meta.env.PROD for true-or-false checks.
  5. If a package causes it, update the package or switch to its browser build. Adding Node.js polyfills, for example with vite-plugin-node-polyfills, is a last resort that makes the bundle bigger.
  6. Restart the dev server after you edit .env, and redeploy so the build picks up the new names.

Example fix

// Crashes in the browser: process only exists in Node.js.
// const apiUrl = process.env.REACT_APP_API_URL;

// .env: VITE_API_URL=https://api.example.com
const apiUrl = import.meta.env.VITE_API_URL;

// In place of process.env.NODE_ENV === 'development':
if (import.meta.env.DEV) {
  console.log('Calling', apiUrl);
}

Related errors

All errors
ReferenceError: useState is not defined

X is not defined

The code used a name JavaScript can’t find anywhere, usually because of a missing import, a typo, or a Node-only global like process in the browser.

Uncaught Error: supabaseUrl is required.

supabaseUrl is required

The deployed app created its Supabase client with an empty URL, because the environment variable holding it never made it into the build.

ReferenceError: window is not defined

ReferenceError: window is not defined

Code that only works in a browser ran on the server, where there is no window, document, or localStorage.

OpenAIError: It looks like you're running in a browser-like environment. This is disabled by default, as it risks exposing your secret API credentials to attackers. If you understand the risks and have appropriate mitigations in place, you can set the `dangerouslyAllowBrowser` option to `true`, e.g., new OpenAI({ apiKey, dangerouslyAllowBrowser: true }); https://help.openai.com/en/articles/5112595-best-practices-for-api-key-safety

It looks like you're running in a browser-like environment

The AI SDK refused to run in the browser, because your secret API key would be visible to anyone who opens the page.

Build with an agent that checks its work

The Layerwise agent clicks through the live preview and reads the console, so it catches errors before you do.

DownloadRead the docs