Jest fails with error: Cannot find module 'react/lib/ReactComponentTreeHook' - reactjs

I have installed Jest v17.0.3 in my react project.
When I run jest locally it works fine, but on the build server it fails with:
Error: Cannot find module 'react/lib/ReactComponentTreeHook' from 'ReactDebugTool.js'
Both machines are running node version 6.9.1 and npm version 4.0.2.

use same version of react and react-dom. My problem fixed after using this command
npm install --save react#15.4.0 react-dom#15.4.0
this problem specially occurs on react 15.4.0 above.

Can you check which version of React you are using? Is it the same on both servers? I would try removing node_modules and reinstalling the dependencies. The reason I am suggesting this is that in React v15.4.0 you cannot import private apis and it seems that ReactDebugTools.js is trying to import from react/lib/....
From the blogpost about React v15.4.0 (Link):
However, there is a possibility that you imported private APIs from react/lib/*, or that a package you rely on might use them. We would like to remind you that this was never supported, and that your apps should not rely on internal APIs. The React internals will keep changing as we work to make React better.
Hope this helps!

In the latest versions of react we often see this error as we have loaded 2 versions of react:
To make sure you have just 1 version, run the following in your terminal:
npm ls react-dom
npm ls react
Both the react and react-dom versions need to be same.
If any one of these returns more than 1 version then that's not supported. You have to then correct it in your corresponding package.json

I had the same issue and i removed the node_modules and ran npm install and it fixed the problem.

Related

How do I avoid double react installations when publishing packages?

I've developed with React for a long time but I've only recently tried my hand at publishing packages.
A dependency of the package I'm working on causes issues if there are conflicting React installations between the package and the project it's being installed into. (The package is react-query)
How do I handle this situation?
Ideally I'd like the two versions to be the same as React 17.x and React 18.x have weird type changes which causes issues when being used together. But I'm honestly completely lost.
Googling doesn't seem to bring up anything I can use.
You should specify react as a peer dependency in your lib package.json file:
"peerDependencies": {
"react": ">= 17"
}
When encountering a peer dependency, npm will check the dependencies of the project that is using your lib:
If these include react matching the version requirements, then nothing else needs to be done
If a suitable version of react was not found, then npm will install the latest matching version
Behavior can be different with older versions of npm and only a warning will be printed in the console during npm install.

Depedency issues, cloned react project

I cloned a React/typescript package from GitHub, but cannot get it to work. When I do npm install, the compiler complains that my typescript version is too new:
WARNING: You are currently running a version of TypeScript which is not officially supported by #typescript-eslint/typescript-estree
Is there some way, I can use exactly the node and packages versions as listed in the package.json?
I've also tried npm install --legacy-pee-deps, but that wasn't fruitful either, still get the problem. Also, I tried setting npm config set save-exact true before installing packages.
Thanks!

Using React Dev Tools with Preact

I have just got preact-redux-example up and running, and now I am attempting to use Preact Dev Tools in my app.
Based on this post I assumed it was a case of adding
import 'preact/devtools'
into the entry point (app.js) file.
However, this yields the following error:
./src/components/app.js
Module not found: Error: Cannot resolve module 'preact/devtools'
Is there something else I need to install, or am I on the wrong track?
preact/devtools has landed in version 6.4.0, but the example project uses version 4.8.0. So you need to upgrade the preact version to be able to import it:
npm install --save preact#latest
Or if you're using yarn you can run:
yarn upgrade preact

Problems updating to React 15.4.0

I'm getting this error with in all my files:
Module not found: Error: Cannot resolve module 'react/lib/ReactMount' in...
I'm using the latest version of react: 15.4.0.
webpack: 1.12.11
Any help?
One quick solution to this will be use npm to install reactjs.
npm install --save react react-dom
Don't use standalone react bundle.
More solutions can be provided if you post your webpack config file.
The problems seems to be located in react-hot-loader library.
As mentioned #gaereon in my react gitub post, apps should not rely on internal APIs. So, react-hot-loader is using ReactMount.
I asked to fix it, for now I will return to latest version of React.
UPDATE
I had the 1x version. I switched to 3x beta version and works fine.

Material-ui response to breaking change in React 15.4.0? "Cannot resolve module 'react/lib/EventPluginHub'"

React v 15.4.0 was released this morning and seems to have included a change that broke react-tap-event-plugin v1.0.0 producing this error:
$ npm build
> myProject#0.1.47 build /.../myProject
> node scripts/build.js
Creating an optimized production build...
Failed to create a production build. Reason:
Module not found: Error: Cannot resolve module 'react/lib/EventPluginHub' in /.../myProject/node_modules/react-tap-event-plugin/src
(note: I cleaned up the output a little)
According to THIS react-tap-event issue log version 2.0.0 of react-tap-event fixes the build problem. However, material-ui is still using react-tap-event version 1.0.0. What are the options here? The only options I can think of are:
Downgrade react and other packages as described in the link above
Wait for Material-UI to upgrade to react-tap-event 2.0.0
Any other solutions here? I'm pretty much dead in the water if I wanted to use react 15.4.0, as far as I can tell.
Almost make sure you update the react-tap-event-plugin to the right version of react.
material-ui version 0.16.3 is released to address the problem.
I had the same problem. I resolved it by going through next steps:
- delete `"react": "{your-version}"` line from package.json;
- delete node_modules dir;
- run `npm i`;
- run `npm i react --save`.
in React 16.4 removes a lot of internals (#121) this plugin depends on and will break the plugin.
https://www.npmjs.com/package/react-tap-event-plugin
as solution with new release of React uninstall thia plugin and deleted any imports and uses from source Reaction Commerce: TypeError: require(...).__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED is undefined
and
Is react-tap-event-plugin still needed in 2018?
i removed react-tap-event-plugin from my reactjs project. it work for me

Resources