Uncaught ReferenceError: process is not defined

Educational use only. Content explains errors and defensive fixes for systems you own or are authorised to test. Do not use any technique here to access data, accounts, or networks without permission.

Root Cause

This error occurs in the browser environment when your JavaScript code attempts to access the `process` object, which is a global object exclusive to Node.js. It typically happens when you are using a library meant for Node.js in a frontend application, or when your bundler (like Webpack 5+ or Vite) no longer automatically polyfills Node.js core modules and globals. Code like `process.env.NODE_ENV` is very common in React/Vue apps, but if the bundler doesn't replace it during the build step, the browser will throw this error.

Fix / Solution

If you are using Vite, access environment variables using `import.meta.env` instead of `process.env`. If you are using Webpack 5, you need to use the `DefinePlugin` to explicitly inject `process.env` variables, or install a polyfill plugin for the `process` object. Ensure you aren't importing a strictly server-side library into your client bundle.

Code Snippet

// ❌ Fails in the browser natively
if (process.env.NODE_ENV === 'production') {}

// ✅ Vite approach
if (import.meta.env.PROD) {}

// ✅ Webpack DefinePlugin configuration (webpack.config.js)
plugins: [
  new webpack.DefinePlugin({
    'process.env.NODE_ENV': JSON.stringify('production')
  })
]