auto-animate icon indicating copy to clipboard operation
auto-animate copied to clipboard

Vite React app v18 support

Open savin2001 opened this issue 2 years ago • 2 comments

I am using the latest Vite React App with TS and for styling, I am using Tailwind CSS. Do you support the latest React app v18 or am I forced to roll back? When I tried to install this animation library I got the error below: >npm install @formkit/auto-animate npm WARN config global --global, --localare deprecated. Use--location=global` instead. npm ERR! code ERESOLVE npm ERR! ERESOLVE could not resolve npm ERR! npm ERR! While resolving: @formkit/[email protected]
npm ERR! Found: [email protected] npm ERR! node_modules/react npm ERR! peer react@"^16 || ^17 || ^18" from @headlessui/[email protected] npm ERR! node_modules/@headlessui/react npm ERR! @headlessui/react@"^1.6.6" from the root project
npm ERR! peer react@"^18.2.0" from [email protected] npm ERR! node_modules/react-dom npm ERR! peer react-dom@"^16 || ^17 || ^18" from @headlessui/[email protected] npm ERR! node_modules/@headlessui/react npm ERR! @headlessui/react@"^1.6.6" from the root project npm ERR! peer react-dom@"^16.0.0 || ^17.0.0 || ^18.0.0" from [email protected] npm ERR! node_modules/react-resize-detector npm ERR! react-resize-detector@"^7.1.2" from [email protected] npm ERR! node_modules/recharts npm ERR! recharts@"^2.1.13" from the root project
npm ERR! 5 more (react-router-dom, react-smooth, ...)
npm ERR! 11 more (react-helmet, react-icons, react-resize-detector, ...) npm ERR! npm ERR! Could not resolve dependency: npm ERR! peerOptional react@"^16.8.0" from @formkit/[email protected] npm ERR! node_modules/@formkit/auto-animate npm ERR! @formkit/auto-animate@"" from the root project
npm ERR! npm ERR! Conflicting peer dependency: [email protected] npm ERR! node_modules/react npm ERR! peerOptional react@"^16.8.0" from @formkit/[email protected] npm ERR! node_modules/@formkit/auto-animate npm ERR! @formkit/auto-animate@"
" 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-08-04T09_52_11_683Z-debug-0.log`

savin2001 avatar Aug 04 '22 10:08 savin2001

Opened a PR for this: https://github.com/formkit/auto-animate/pull/64

icebearlabs avatar Aug 05 '22 10:08 icebearlabs

For the time now: @savin2001 you can override the version in npm:

See also here: https://stackoverflow.com/questions/15806152/how-do-i-override-nested-npm-dependency-versions

This is what works for me:

  "overrides": {
    "@formkit/auto-animate": {
      "react": "$react"
    }
  }

icebearlabs avatar Aug 05 '22 10:08 icebearlabs

This shouldnt be a problem with beta.3 👍peerDependencies are gonzo

justin-schroeder avatar Aug 26 '22 12:08 justin-schroeder