React - Uncaught reference: process is not defined

Recently, I started getting the error process is not defined in the react project. It is really annoying as I have to refresh the browser to view the code changes.

After scratching my head for few hours, I found that this error is a result of react-error-overlay package, which is a dependency of react-scripts package. This package's dependencies were updated to support webpack v5, which unfortunately is not compatible with react-scripts v4.

To fix this issue in npm, configure the following in package.json

"resolutions": {
    "react-error-overlay": "6.0.9"
},

"scripts":{
    "preinstall": "npx npm-force-resolutions",
    ....
},

"devDependencies":{
    "react-error-overlay": "6.0.9",
...
}

and delete the folder npm_modules and file package-lock.json.

After that, do install using

npm install

This should fix the issue and hopefully, save you couple of hours :-)

For full details of this issue, refer to the issue here -  https://github.com/facebook/create-react-app/issues/11773