node-util: Undeclared use of node's `process` causes exception in browser

I hit this one today as well. Like @ljharb said, looks like you can use ProvidePlugin like this:

// webpack needs to be explicitly required
const webpack = require('webpack')

module.exports = {

/* ... rest of the config here ... */

  plugins: [
    // fix "process is not defined" error:
    // (do "npm install process" before running the build)
    new webpack.ProvidePlugin({
      process: 'process/browser',
    }),
  ]
}

More here.

I wasn’t 100% in love with using the process package for this project so I ended up using DefinePlugin instead:

plugins: [  
  new webpack.DefinePlugin({
    'process.env.NODE_DEBUG': JSON.stringify(process.env.NODE_DEBUG)
  })
]

Both solutions seem to work.

For those who use Vite or Nuxt3

Error with process.env.NODE_DEBUG

solutions ==>

1. Install polyfill using npm or yarn

yarn add @esbuild-plugins/node-globals-polyfill

1. Add to your vite or nuxt config (NUXT example, vite similar)

import {NodeGlobalsPolyfillPlugin} from '@esbuild-plugins/node-globals-polyfill'

export default defineNuxtConfig({
vite: {
        optimizeDeps: {
            esbuildOptions: {
                define: {
                    global: 'globalThis'
                },
                plugins: [
                    NodeGlobalsPolyfillPlugin({
                        process: true,
                        buffer: true
                    }),
                ]
            }
        },
    }
})

With this config Web3 and other work perfect

The best fix, unfortunately, is to use ProvidePlugin in your config to replicate the functionality webpack 5 removed.

// webpack needs to be explicitly required
const webpack = require('webpack')

module.exports = {

/* ... rest of the config here ... */

  plugins: [
    // fix "process is not defined" error:
    // (do "npm install process" before running the build)
    new webpack.ProvidePlugin({
      process: 'process/browser',
    }),
  ]
}

@brenc Thanks you man soooo much for clear, referenced reply. This saved me so much time. after 5 days of stress. This worked for me. 2nd one magically didn’t work. Because of other packages.

Solve in !67

Can we get a fix on this soon? Webpack v5 is now the main version.

For the env check, that would be enough, but we also use process.nextTick in the callbackify implementation

For those who use Vite or Nuxt3

Error with process.env.NODE_DEBUG

solutions ==>

1. Install polyfill using npm or yarn

yarn add @esbuild-plugins/node-globals-polyfill

1. Add to your vite or nuxt config (NUXT example, vite similar)

import {NodeGlobalsPolyfillPlugin} from '@esbuild-plugins/node-globals-polyfill'

export default defineNuxtConfig({
vite: {
        optimizeDeps: {
            esbuildOptions: {
                define: {
                    global: 'globalThis'
                },
                plugins: [
                    NodeGlobalsPolyfillPlugin({
                        process: true,
                        buffer: true
                    }),
                ]
            }
        },
    }
})

With this config Web3 and other work perfect

I’m getting ReferenceError: Buffer is not defined when building app

All node modules may require node core module polyfills; it’s the job of a working node module bundler to handle that. Those that don’t, are broken.