Cannot read property 'forEach' of undefined (React)

Question

Today I started learning react! and I am having difficulties.

I created a project using npx create-react-app my-app. If I use npm start, the application does not work. I have not made any changes to the project

The console contains this error:

react-refresh-runtime.development.js:465 Uncaught TypeError: Cannot read property 'forEach' of undefined
    at Object.injectIntoGlobalHook (react-refresh-runtime.development.js:465)
    at Object../node_modules/@pmmmwh/react-refresh-webpack-plugin/client/ReactRefreshEntry.js (ReactRefreshEntry.js:8)
    at __webpack_require__ (bootstrap:856)
    at fn (bootstrap:150)
    at Object.1 (reportWebVitals.js:14)
    at __webpack_require__ (bootstrap:856)
    at checkDeferredModules (bootstrap:45)
    at Array.webpackJsonpCallback [as push] (bootstrap:32)
    at main.chunk.js:1

How i can fix this error?

Answer 1

It appears that this issue has been around for a couple of months now, catching those who are new to Create React App. It's rather unfortunate but depending on your CRA version the solution is to either:

• Install React Dev Tools plugin
• Update React Dev Tools plugin
• Uninstall/Disable React Dev Tools plugin

I've documented it here: https://github.com/facebook/create-react-app/issues/10500