Hi I have this problem where if I want to install react-spring into my react project It just pops up bunch of dependencies errors and warnings and I don't know what to do with it. I tried to check documentation of react-spring but I couldn't find anything. I checked few pages here on stackoverflow and I still did not find anything useful. Can somebody help?
npm WARN ERESOLVE overriding peer dependency
npm WARN Found: react#17.0.2
npm WARN node_modules/react-spring/node_modules/react
npm WARN peer react#">=16.8" from #react-spring/konva#9.0.0
npm WARN node_modules/react-spring/node_modules/#react-spring/konva
npm WARN #react-spring/konva#"^9.0.0" from react-spring#9.0.0
npm WARN node_modules/react-spring
npm WARN
npm WARN Could not resolve dependency:
npm WARN peer react#"16.8.x" from react-konva#16.8.6
npm WARN node_modules/react-spring/node_modules/react-konva
npm WARN peer react-konva#">=16.8" from #react-spring/konva#9.0.0
npm WARN node_modules/react-spring/node_modules/#react-spring/konva
npm WARN ERESOLVE overriding peer dependency
npm WARN Found: react#17.0.2
npm WARN node_modules/react-spring/node_modules/react
npm WARN peer react#">=16.8" from #react-spring/konva#9.0.0
npm WARN node_modules/react-spring/node_modules/#react-spring/konva
npm WARN #react-spring/konva#"^9.0.0" from react-spring#9.0.0
npm WARN node_modules/react-spring
npm WARN
npm WARN Could not resolve dependency:
npm WARN peer react#"^16.0.0" from react-dom#16.8.6
npm WARN node_modules/react-spring/node_modules/react-dom
npm WARN peer react-dom#"16.8.x" from react-konva#16.8.6
npm WARN node_modules/react-spring/node_modules/react-konva
npm WARN ERESOLVE overriding peer dependency
npm WARN Found: konva#7.2.5
npm WARN node_modules/konva
npm WARN peer konva#">=2.6" from #react-spring/konva#9.0.0
npm WARN node_modules/react-spring/node_modules/#react-spring/konva
npm WARN #react-spring/konva#"^9.0.0" from react-spring#9.0.0
npm WARN node_modules/react-spring
npm WARN
npm WARN Could not resolve dependency:
npm WARN peer konva#"^3.2.3" from react-konva#16.8.6
npm WARN node_modules/react-spring/node_modules/react-konva
npm WARN peer react-konva#">=16.8" from #react-spring/konva#9.0.0
npm WARN node_modules/react-spring/node_modules/#react-spring/konva
npm WARN ERESOLVE overriding peer dependency
npm WARN While resolving: react-spring#9.0.0
npm WARN Found: react-dom#17.0.2
npm WARN node_modules/react-dom
npm WARN peerOptional react-dom#">=17.0" from #react-three/fiber#6.0.1
npm WARN node_modules/#react-three/fiber
npm WARN peer #react-three/fiber#">=6.0" from #react-spring/three#9.0.0
npm WARN node_modules/#react-spring/three
npm WARN
npm WARN Could not resolve dependency:
npm WARN peerOptional react-dom#">=17.0" from #react-three/fiber#6.0.1
npm WARN node_modules/#react-three/fiber
npm WARN peer #react-three/fiber#">=6.0" from #react-spring/three#9.0.0
npm WARN node_modules/#react-spring/three
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! Found: react#17.0.1
npm ERR! node_modules/react
npm ERR! peer react#"*" from #testing-library/react#11.2.5
npm ERR! node_modules/#testing-library/react
npm ERR! #testing-library/react#"^11.2.5" from the root project
npm ERR! peer react#"17.0.1" from react-dom#17.0.1
npm ERR! node_modules/react-dom
npm ERR! peer react-dom#"*" from #testing-library/react#11.2.5
npm ERR! node_modules/#testing-library/react
npm ERR! #testing-library/react#"^11.2.5" from the root project
npm ERR! peer react-dom#">=16.0.0" from react-visibility-sensor#5.1.1
npm ERR! node_modules/react-visibility-sensor
npm ERR! react-visibility-sensor#"^5.1.1" from the root project
npm ERR! 1 more (the root project)
npm ERR! 4 more (react-scripts, react-visibility-sensor, ...)
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react#"^17.0.2" from react-reconciler#0.26.2
npm ERR! node_modules/#react-three/fiber/node_modules/react-reconciler
npm ERR! react-reconciler#"^0.26.2" from #react-three/fiber#6.0.1
npm ERR! node_modules/#react-three/fiber
npm ERR! peer #react-three/fiber#">=6.0" from #react-spring/three#9.0.0
npm ERR! node_modules/#react-spring/three
npm ERR! #react-spring/three#"^9.0.0" from react-spring#9.0.0
npm ERR! node_modules/react-spring
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR!
npm ERR! See C:\...\AppData\Local\npm-cache\eresolve-report.txt for a full report.
npm ERR! A complete log of this run can be found in:
The issue is with npm7 requiring peer deps to be installed. This is a feature of npm7, not a bug. react-spring is the global package for the library and therefore contains all our targets. Unless you really are doing an app that requires zDog, konva etc. I would install the specific target you're after.
i.e npm install #react-spring/web the /* can be replaced with any target we support, for more information please see the docs
Had the same problem, this suggestion fixed the installation error.
Still didn't try to work with it though.
Basically, we should add
"peerDependencies": {
"react-spring": "^8.x"
}
to the package.json file
Got the similar kind of problem when added "#twilio/video-room-monitor": "^1.0.1" dependency and resolved by adding "react-spring" in dependencies, reference link
"dependencies": {
"react-spring": "^9.6.1"
}
I had the same problem using React 17.0.2 but success with run npm install -g react-spring and then go without errors but still a lot of warnings
Related
I'm getting this error trying to init tailwind for a Shopify Hydrogen installation.
Any ideas on how to fix this without downgrading react? Thanks in advance for any help.
Error:
npx tailwindcss init
Debugger attached.
npm WARN ERESOLVE overriding peer dependency
npm WARN While resolving: react-reconciler#0.26.2
npm WARN Found: react#18.2.0
npm WARN node_modules/react
npm WARN peer react#"^16 || ^17 || ^18" from #headlessui/react#1.7.10
npm WARN node_modules/#headlessui/react
npm WARN #headlessui/react#"^1.7.2" from the root project
npm WARN 15 more (#remix-run/eslint-config, #remix-run/react, ...)
npm WARN
npm WARN Could not resolve dependency:
npm WARN peer react#"^17.0.2" from react-reconciler#0.26.2
npm WARN node_modules/ink/node_modules/react-reconciler
npm WARN react-reconciler#"^0.26.2" from ink#3.2.0
npm WARN node_modules/ink
npm WARN
npm WARN Conflicting peer dependency: react#17.0.2
npm WARN node_modules/react
npm WARN peer react#"^17.0.2" from react-reconciler#0.26.2
npm WARN node_modules/ink/node_modules/react-reconciler
npm WARN react-reconciler#"^0.26.2" from ink#3.2.0
npm WARN node_modules/ink
Recently after installing react-collapsed package with npm there was no issue with running on localhot and everything was as expected. However after building on AWS Amplify I encountered the following dependency error. I've tried npm ci to clean up the dependencies with no luck. Any tips would be greatly appreciated!
2023-02-03T05:34:40.280Z [WARNING]: ERR! ERESOLVE could not resolve
npm ERR!
2023-02-03T05:34:40.280Z [WARNING]: npm ERR! While resolving: react-collapsed#3.6.0
npm ERR! Found: react#18.2.0
npm ERR! node_modules/react
npm ERR!
2023-02-03T05:34:40.281Z [WARNING]: react#"^18.2.0" from the root project
npm ERR! peer react#"^18.2.0" from react-dom#18.2.0
npm ERR! node_modules/react-dom
npm ERR! react-dom#"^18.2.0" from the root project
npm ERR! 3 more (react-router, react-router-dom, react-scripts)
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react#"^16.8 || ^17" from react-collapsed#3.6.0
2023-02-03T05:34:40.281Z [WARNING]: npm ERR! node_modules/react-collapsed
npm ERR! react-collapsed#"^3.6.0" from the root project
npm ERR!
npm ERR! Conflicting peer dependency: react#17.0.2
npm ERR! node_modules/react
npm ERR! peer react#"^16.8 || ^17" from react-collapsed#3.6.0
npm ERR! node_modules/react-collapsed
npm ERR! react-collapsed#"^3.6.0" from the root project
npm ERR!
2023-02-03T05:34:40.281Z [WARNING]:
Tried uninstalling which reverted the issue, npm ci didn't resolve the issue
After some digging it appears that react-collapsed removed support for react 18 temporarily: https://github.com/roginfarrer/collapsed/pull/120. Rolling back to react-collapsed#3.0 solved the issue
I'm trying to install npm i react-top-loading-bar but I got following error:
ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR! While resolving: newsapp#0.1.0
npm ERR! Found: react#18.2.0
npm ERR! node_modules/react
npm ERR! react#"^18.2.0" from the root project
npm ERR! Could not resolve dependency:
npm ERR! peer react#"^16 || ^17" from react-top-loading-bar#2.1.0
npm ERR! node_modules/react-top-loading-bar
npm ERR! react-top-loading-bar#"*" from the root project
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution
try running
npm i react-top-loading-bar --force
or
npm i react-top-loading-bar --legacy-peer-deps
if it doesnot work try downgrading your node version.
Why am I having the below error
PS C:\Users\USER\Desktop\Shareme\shareme_frontend> npm install #sanity/client #sanity/image-url react-google-login react-icons react-loader-spinner react-masonry-css react-router-dom uuid
npm WARN config global `--global`, `--local` are deprecated. Use `--location=global` instead.
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: shareme_frontend#0.1.0
npm ERR! Found: react#18.2.0
npm ERR! node_modules/react
npm ERR! react#"^18.2.0" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react#"^16 || ^17" from react-google-login#5.2.2
npm ERR! node_modules/react-google-login
npm ERR! react-google-login#"*" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR!
npm ERR! See C:\Users\USER\AppData\Local\npm-cache\eresolve-report.txt for a full report.
npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\USER\AppData\Local\npm-cache\_logs\2022-06-29T15_11_18_949Z-debug-0.log
react-google-login is not updated to the latest react v18.
Either wait for an update, downgrade react to v17, or use --force flag.
npm i react-google-login --force
Note that by using --force, there is no guarantee that this package will work with v18 of react
react-google-login#5.2.2 is not compatible with react 18 version as 5.2.2 is published year ago as per npm page.
It is still looking for react version of 17 / 16.
Below error block will tell you this:
npm ERR! Could not resolve dependency:
npm ERR! peer react#"^16 || ^17" from react-google-login#5.2.2
You can downgrade your react for this specific project via :
deleting node_modules
run npm cache clean
manually update your package.json to change version of react to 17
run npm install
How to resolve these errors while installing chakra-ui and react app?
**user#user:~/Desktop/Projects$ npx create-react-app my-app --template #chakra-ui**
[Error][1]
Creating a new React app in /home/user/Desktop/Projects/my-app.
Installing packages. This might take a couple of minutes.
Installing react, react-dom, and react-scripts with #chakra-ui/cra-template...
added 1935 packages, and audited 1936 packages in 2m
125 packages are looking for funding
run `npm fund` for details
found 0 vulnerabilities
Initialized a git repository.
Installing template dependencies using npm...
npm WARN ERESOLVE overriding peer dependency
npm WARN Found: react#17.0.1
npm WARN node_modules/react
npm WARN peer react#"17.0.1" from react-dom#17.0.1
npm WARN node_modules/react-dom
npm WARN react-dom#"^17.0.1" from the root project
npm WARN 4 more (framer-motion, #testing-library/react, ...)
npm WARN 54 more (the root project, #chakra-ui/react, #emotion/react, ...)
npm WARN
npm WARN Could not resolve dependency:
npm WARN peer react#"^16.8.0" from react-remove-scroll#2.4.0
npm WARN node_modules/react-remove-scroll
npm WARN react-remove-scroll#"2.4.0" from #chakra-ui/modal#1.4.3
npm WARN node_modules/#chakra-ui/modal
npm WARN ERESOLVE overriding peer dependency
npm WARN Found: react#17.0.1
npm WARN node_modules/react
npm WARN peer react#"17.0.1" from react-dom#17.0.1
npm WARN node_modules/react-dom
npm WARN react-dom#"^17.0.1" from the root project
npm WARN 4 more (framer-motion, #testing-library/react, ...)
npm WARN 54 more (the root project, #chakra-ui/react, #emotion/react, ...)
npm WARN
npm WARN Could not resolve dependency:
npm WARN peer react#"^16.8.0" from react-focus-lock#2.4.1
npm WARN node_modules/react-focus-lock
npm WARN react-focus-lock#"2.4.1" from #chakra-ui/focus-lock#1.0.3
npm WARN node_modules/#chakra-ui/focus-lock
npm WARN ERESOLVE overriding peer dependency
npm WARN Found: react#17.0.1
npm WARN node_modules/react
npm WARN peer react#"17.0.1" from react-dom#17.0.1
npm WARN node_modules/react-dom
npm WARN react-dom#"^17.0.1" from the root project
npm WARN 4 more (framer-motion, #testing-library/react, ...)
npm WARN 54 more (the root project, #chakra-ui/react, #emotion/react, ...)
npm WARN
npm WARN Could not resolve dependency:
npm WARN peer react#"^16.8.0" from #reach/alert#0.11.0
npm WARN node_modules/#reach/alert
npm WARN #reach/alert#"0.11.0" from #chakra-ui/toast#1.1.5
npm WARN node_modules/#chakra-ui/toast
npm WARN ERESOLVE overriding peer dependency
npm WARN Found: react-dom#17.0.1
npm WARN node_modules/react-dom
npm WARN react-dom#"^17.0.1" from the root project
npm WARN 4 more (framer-motion, #testing-library/react, ...)
npm WARN
npm WARN Could not resolve dependency:
npm WARN peer react-dom#"^16.8.0" from #reach/alert#0.11.0
npm WARN node_modules/#reach/alert
npm WARN #reach/alert#"0.11.0" from #chakra-ui/toast#1.1.5
npm WARN node_modules/#chakra-ui/toast
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! Found: react#17.0.1
npm ERR! node_modules/react
npm ERR! peer react#"17.0.1" from react-dom#17.0.1
npm ERR! node_modules/react-dom
npm ERR! react-dom#"^17.0.1" from the root project
npm ERR! peer react-dom#">=16.8" from framer-motion#3.2.1
npm ERR! node_modules/framer-motion
npm ERR! framer-motion#">=3.0.0" from the root project
npm ERR! 8 more (#chakra-ui/react, #chakra-ui/checkbox, ...)
npm ERR! 3 more (#testing-library/react, #chakra-ui/portal, #chakra-ui/toast)
npm ERR! react#"^17.0.1" from the root project
npm ERR! 53 more (#chakra-ui/react, #emotion/react, #emotion/styled, ...)
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react#"^16.8.0" from #reach/utils#0.11.0
npm ERR! node_modules/#reach/alert/node_modules/#reach/utils
npm ERR! #reach/utils#"0.11.0" from #reach/alert#0.11.0
npm ERR! node_modules/#reach/alert
npm ERR! #reach/alert#"0.11.0" from #chakra-ui/toast#1.1.5
npm ERR! node_modules/#chakra-ui/toast
npm ERR! #chakra-ui/toast#"1.1.5" from #chakra-ui/react#1.1.4
npm ERR! node_modules/#chakra-ui/react
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR!
npm ERR! See /home/user/.npm/eresolve-report.txt for a full report.
npm ERR! A complete log of this run can be found in:
npm ERR! /home/user/.npm/_logs/2021-01-17T07_29_38_104Z-debug.log
`npm install --save #chakra-ui/react#^1.0.0 #emotion/react#^11.0.0 #emotion/styled#^11.0.0 react-icons#^3.0.0 framer-motion#>=3.0.0 #testing-library/jest-dom#^5.9.0 #testing-library/react#^10.2.1 #testing-library/user-event#^12.0.2 web-vitals#^0.2.2` failed
how to fix it?
<blockquote class="imgur-embed-pub" lang="en" data-id="a/M0Rpz86" data-context="false" ></blockquote><script async src="//s.imgur.com/min/embed.js" charset="utf-8"></script>
This works for me!
npx create-react-app my-app --template #chakra-ui** --legacy-peer-deps