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.
Related
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!
When I try to upgrade from react-native#0.63.4 to 0.64.3, I notice that 0.64.3 uses react#17.0.1, and this causes conflicts with a lot of libraries that have peer dependencies of lower versions of react. I know that I can either manually go change the versions of packages, or use npm i --legacy-peer-deps. Is one better than the other?
I installed eslint in my react project to fix all the eslint errors. I fixed all the errors, however, I can't npm start the project. When I do that, I get this error, and some steps to uninstall all the eslint dependencies. I want to run the project with eslint dependencies.
Please let me know how to do this?
Error Message:
There might be a problem with the project dependency tree. It is
likely not a bug in Create React App, but something you need to fix
locally.
The react-scripts package provided by Create React App requires a
dependency:
"eslint": "^7.11.0"
Don't try to install it manually: your package manager does it
automatically. However, a different version of eslint was detected
higher up in the tree:
My guess would be that you installed eslint#v8 and since create-react-app doesn't support it yet (reference) it causes this error.
Downgrading to eslint v7 should fix it.
Create react app already comes bundled with eslint and by installing it in the project dependencies, you are in effect try to load in conflicting versions, you shouldn't need eslint inside of your own package.json.
HOWEVER
If you want to override eslint and start customising your react install you are more than welcome to eject (npm run eject), but bear in mind that ejecting your application will mean you will need to maintain dependencies going forwards.
You can read more about ejecting here - https://create-react-app.dev/docs/available-scripts/
I am using create-react-app for a project. I installed various eslint plugins etc, however, we all know that create-react-app already comes with certain dependencies that are not shown in package.json.
I want the newest eslint version which is currently 5.3.0. Create-react-app comes with 5.16.0. WITHOUT EJECTING, how do I bring this dependency to the newest version without breaking everything?
I get the following error:
The react-scripts package provided by Create React App requires a dependency:
"eslint": "^5.16.0"
Don't try to install it manually: your package manager does it automatically.
However, a different version of eslint was detected higher up in the tree:
:\node_modules\eslint (version: 5.3.0)
Things in package.json will take precedence so if you upgrade version of eslint, react-scripts should always take the latest version.
There is a small loophole though. If you fiddle too much with dependencies you might get the warning about mismatch version by react-scripts. To avoid that you can create .env file and can specify the following.
SKIP_PREFLIGHT_CHECK=true
I just solved this issue, the error says:
The react-scripts package provided by Create React App requires a dependency:
"eslint": "5.16.0"
but also says you have another version at package.json that's
\node_modules\eslint (version: 5.3.0) in my case was 6.1.0
so my solution was:
I searched for the dependency called eslint and updated the version similar to Create React App expected "eslint": "^5.16.0" at package.json
Then run npm install and now you can run npm start... if you have troubles with slint-plugin-import just update the version as well.
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.