facebook / react

The library for web and native user interfaces.
https://react.dev
MIT License
229.34k stars 46.97k forks source link

Cannot read property 'ReactDebugCurrentFrame' of undefined #14137

Closed btf93 closed 6 years ago

btf93 commented 6 years ago

Hi, I get the following issue in Chrome developer tools Console after updating to the latest version of React.

It doesn't seem a very common issue? Please let me know if there's any other information I can provide?

Uncaught TypeError: Cannot read property 'ReactDebugCurrentFrame' of undefined at eval (webpack-internal:///987:655) at eval (webpack-internal:///987:3570) at Object. (bundle.js:11919) at webpack_require (bundle.js:20) at eval (webpack-internal:///478:34) at Object. (bundle.js:5811) at webpack_require (bundle.js:20) at eval (webpack-internal:///597:7) at Object. (bundle.js:7239) at __webpack_require__ (bundle.js:20)

gaearon commented 6 years ago

A full reproducing project would be nice.

btf93 commented 6 years ago

A full reproducing project would be nice.

I can't put in any code due to work restrictions, but these are the current React versions from package.json:

devDependencies": { "react-dom": "^16.6.0", "react-test-renderer": "^15.6.2", "redux-mock-store": "^1.2.3", }, "dependencies": { "react": "^16.6.0", "react-custom-select": "^0.0.2", "react-datetime": "^2.16.2", "react-input-autosize": "^1.2.0", "react-nested-file-tree": "^0.0.4", "react-numeric-input": "^2.2.3", "react-redux": "^5.1.0", "react-router-dom": "^4.3.1", "react-simple-accordion": "0.0.1", "react-tooltip": "^3.9.0", },

I wondered if I'm missing something from there?

sophiebits commented 6 years ago

It sounds like maybe you are using incompatible versions of react and react-dom. It's odd that react-dom is not in dependencies in your package.json too.

btf93 commented 6 years ago

It sounds like maybe you are using incompatible versions of react and react-dom. It's odd that react-dom is not in dependencies in your package.json too.

Thanks for the response. Is there a way to find out which 'react' and 'react-dom' versions are compatible? Also, I'll copy 'react-dom' to dependencies.

I followed the install from here: https://reactjs.org/blog/2018/10/23/react-v-16-6.html

Where it says to use: npm install --save react@^16.6.0 react-dom@^16.6.0

chasestarr commented 6 years ago

@btf93 you should maintain the exact same react and react-dom versions.

I like to run npm ls to view my local dependency versions. Grep for react to filter the lines npm ls | grep react. You may see a variety of react-related npm packages. You're looking specifically for react and react-dom

btf93 commented 6 years ago

@chasestarr Thanks for the response. I deleted Node_Modules folder and reinstalled all of the updates, and this error seems to have disappeared (for now). I've installed prop_types seperately and it's referenced everywhere in the import as it should be:

import React from 'react'; import PropTypes from 'prop-types'

However I have the following error message:

"Uncaught TypeError: Cannot read property 'object' of undefined"

gaearon commented 6 years ago

You probably have some code that does React.PropTypes.object (which doesn't exist in 16). Check by the stack trace where the error happens. If it's a third party package, you can try looking for a new version. As the last workaround, you could do something like React.PropTypes = PropTypes before any code runs.

pascalwhoop commented 5 years ago

I had this when trying to emulate our current project running react v15 while using the react-hot-reloader based on create-react-app. So I started a new app and set the react version to v15 which caused this I then noted that upgrading react/redux from 15->16/ 3->4 respectively doesn't hurt much so I went for that.

LeiZeng commented 3 years ago

I have identified the root cause probably, while trying to use @react-three/fiber, and I don't think it's a version compatible issue.

Tltr: react-reconciler will drive itself into endless error loop when NODE_ENV=development and use production bundle of React. Especially the loop is a do{}while(true) synchronous loop, which make the application blocked.

The error is caused at: https://github.com/facebook/react/blob/cae635054e17a6f107a39d328649137b83f25972/packages/react-reconciler/src/ReactCurrentFiber.js#L48 where ReactDebugCurrentFrame is undefined, which should be injected by react DEV version.

The thing is that react bundle and react-reconciler bundle could not always be the same mode, as react-reconciler is usually a dependency of third party tools like @react-three/fiber.

@gaearon please take a look at this one, I can make a PR if possible.

@pascalwhoop @btf93 to resolve this issue quickly, you can check if your NODE_ENV is development, and make it if not.

reference to same issues: https://github.com/diegomura/react-pdf/issues/953 https://github.com/diegomura/react-pdf/issues/565