0

I'm trying to learn react/typescript and I'm following a tutorial line for line, but somehow getting this error when trying to install either @chakra-ui/react or @chakra-ui/core. It seems like a dependecy issue with react having been updated. Should I rollback react?

kyoudai.industries git:(master) ✗ npm install @chakra-ui/react framer-motion
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR! 
npm ERR! While resolving: kyoudai.industries@1.0.0
npm ERR! Found: react@17.0.1
npm ERR! node_modules/react
npm ERR!   react@"^17.0.1" from the root project
npm ERR!   peer react@"16.x || 17.x" from @chakra-ui/react@1.0.1
npm ERR!   node_modules/@chakra-ui/react
npm ERR!     @chakra-ui/react@"*" from the root project
npm ERR!   2 more (@emotion/react, @emotion/styled)
npm ERR! 
npm ERR! Could not resolve dependency:
npm ERR! peer react@"^16.8" from framer-motion@2.9.4
npm ERR! node_modules/framer-motion
npm ERR!   framer-motion@"*" from the root project
npm ERR!   peer framer-motion@"^2.9.4" from @chakra-ui/react@1.0.1
npm ERR!   node_modules/@chakra-ui/react
npm ERR!     @chakra-ui/react@"*" 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 /Users/travis/.npm/eresolve-report.txt for a full report.

npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/travis/.npm/_logs/2020-11-24T22_38_57_297Z-debug.log
Travis
  • 1

1 Answers1

2

With this command you can solve the problem:

npm i @chakra-ui/react --legacy-peer-deps

Amir Saedi
  • 21
  • 1
  • Can you explain why that solution works and what's wrong with the implementation used in the question ? – Bharat Dec 02 '20 at 14:17
  • I think because chakra-ui didn't update peerDependencies and it makes conflict with react v17, You can use the --legacy-peer-deps flag at install time. npm v7 enabled this flag for a while as projects gradually update their conflicting dependencies. – Amir Saedi Dec 02 '20 at 14:42