React version error inititalizing Tailwind for Shopify Hydrogen - reactjs

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

Related

Installing react-redux-firebase package with React 18

I'm trying to install this package npm install --save react-redux-firebase for React and I'm getting this error “Could not resolve dependency: npm ERR! peer react#"^16.3.0 || ^17.0.0" from react-side-effect#2.1.1” I use 18.2 version of React
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: professional-resources#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.3.0 || ^17.0.0" from react-redux-firebase#3.11.0
npm ERR! node_modules/react-redux-firebase
npm ERR! react-redux-firebase#"*" 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 resoluti
on.
What can i do:
The problem is that this library does not support react 18 or if they support it they didn't add it as a peer deps: see
You have multiple solutions:
Downgrading to react 17
Asking library maintainers and help them to upgrade to react 18
Forcing versions with npm resolutions (Use it at your own risk as the library does not support react 18 inside their peerDeps)
try this instead:
npm install --legacy-peer-deps react-redux-firebase redux-firestore

npm WARN ERESOLVE overriding peer dependency npm WARN While resolving: react-headroom#3.0.0

Don't know why the error showing. Please help
npm WARN ERESOLVE overriding peer dependency
npm WARN While resolving: react-headroom#3.0.0

React spring Errors while installing

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

How to fix these errors while installing chakra-ui and react app?

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

Error when trying npm install tslint and rxjs

I've tried npm install tslint and npm install rxjs, both run after npm cache clean and with #latest in the end. Every time I keep getting "UNMET PEER DEPENDECY rxjs#5.0.3" and "UNMET PEER DEPENDENCY tslint#4.3.1".
The entire failure stack is
[jannik#jannik-dimsen app (AngularApp *)]$ npm install
first-app#0.0.0 /home/jannik/angular2apps/first-app
├── UNMET PEER DEPENDENCY rxjs#5.0.3
└── UNMET PEER DEPENDENCY tslint#4.3.1
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents#^1.0.0 (node_modules/chokidar/node_modules/fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents#1.0.17: wanted {"os":"darwin","
arch":"any"} (current: {"os":"linux","arch":"x64"})
npm WARN #angular/core#2.2.3 requires a peer of rxjs#5.0.0-beta.12 but none was installed.
npm WARN #angular/http#2.2.3 requires a peer of rxjs#5.0.0-beta.12 but none was installed.
npm WARN #angular/router#3.2.3 requires a peer of rxjs#5.0.0-beta.12 but none was installed.
npm WARN codelyzer#2.0.0-beta.3 requires a peer of tslint#~4.0.0 but none was installed.
npm WARN tslint-loader#2.1.5 requires a peer of tslint#^3.0.0 but none was installed.
npm ERR! code 1
Some sites suggested running npm cache clean but that didn't fix my problem, and I can't figure out why I can't install those npm modules. I've added them to the package.json file as well and tried a npm install giving the same error

Resources