React 17 support in peer deps

[alex198710]

It would be good if react-spring was updated to support React 17. Are there any plans to do this?

[joshuaellis]

Why do you think it doesn't support react@17? I've used it on a few projects now with no problems....

[alex198710]

Hello @joshuaellis,
In a create-react-app I had to force the install but not specifically for react-spring.
I got this warning though:

npm WARN Could not resolve dependency:
npm WARN peer react@"16.8.x" from [email protected]
npm WARN node_modules/react-spring/node_modules/react-konva
npm WARN   peer react-konva@">=16.8" from @react-spring/[email protected]
npm WARN   node_modules/react-spring/node_modules/@react-spring/konva
npm WARN ERESOLVE overriding peer dependency
npm WARN Found: [email protected]
npm WARN node_modules/react
npm WARN   react@"^17.0.0" from the root project
npm WARN   30 more (@material-ui/core, react-dom, @material-ui/icons, ...)
npm WARN 
npm WARN Could not resolve dependency:
npm WARN peer react@"^16.0.0" from [email protected]
npm WARN node_modules/react-spring/node_modules/react-dom
npm WARN   peer react-dom@"16.8.x" from [email protected]
npm WARN   node_modules/react-spring/node_modules/react-konva
npm WARN ERESOLVE overriding peer dependency
npm WARN Found: [email protected]
npm WARN node_modules/konva
npm WARN   peer konva@">=2.6" from @react-spring/[email protected]
npm WARN   node_modules/react-spring/node_modules/@react-spring/konva
npm WARN     @react-spring/konva@"~9.1.2" from [email protected]
npm WARN     node_modules/react-spring
npm WARN 
npm WARN Could not resolve dependency:
npm WARN peer konva@"^3.2.3" from [email protected]
npm WARN node_modules/react-spring/node_modules/react-konva
npm WARN   peer react-konva@">=16.8" from @react-spring/[email protected]
npm WARN   node_modules/react-spring/node_modules/@react-spring/konva
npm WARN ERESOLVE overriding peer dependency
npm WARN Found: [email protected]
npm WARN node_modules/react
npm WARN   react@"^17.0.0" from the root project
npm WARN   30 more (@material-ui/core, react-dom, @material-ui/icons, ...)
npm WARN 
npm WARN Could not resolve dependency:
npm WARN peer react@"17.0.1" from [email protected]
npm WARN node_modules/react-native
npm WARN   peer react-native@">=0.58" from @react-spring/[email protected]
npm WARN   node_modules/@react-spring/native
npm WARN ERESOLVE overriding peer dependency
npm WARN While resolving: [email protected]
npm WARN Found: [email protected]
npm WARN node_modules/react-dom
npm WARN   peerOptional react-dom@">=17.0" from @react-three/[email protected]
npm WARN   node_modules/@react-three/fiber
npm WARN     peer @react-three/fiber@">=6.0" from @react-spring/[email protected]
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/[email protected]
npm WARN node_modules/@react-three/fiber
npm WARN   peer @react-three/fiber@">=6.0" from @react-spring/[email protected]
npm WARN   node_modules/@react-spring/three

[joshuaellis]

npm@7 is imo really annoying when it comes to peer deps. ATM, we just have our peer deps for react at >=16.8 (when i think hooks were introduced?). I'm not sure if there's a way to include major versions i.e. 17 should be fine cause it is higher than 16.8

[s-thom]

npm's semver docs say you can specify an OR (||) in the dependency ranges. Changing the peer dependency lines to something along the lines of >=16.8 || ^17 would allow any minor versions of React 17, but not React 18 or higher (in case of breaking changes). Here's an example in another repository of this usage.

I believe the change to the peerDependencies in package.json could be released as a patch release; I don't think it's semver major or minor. I'd put together a PR myself, but I'm not familiar with the react-spring project and am a little afraid of missing something important.

[joshuaellis]

Thanks for that info, I'll look at implementing that on our upcoming v9.2.0

[joshuaellis]

This has been released on v9.2.0-beta.3.

[mAAdhaTTah]

react-konva is also tied to the React version (see here) and should be loosened similar to react / react-dom (^16 || ^17). This is the error I get with v9.2.0-beta.3:

npm WARN ERESOLVE overriding peer dependency
npm WARN Found: [email protected]
npm WARN node_modules/react
npm WARN   react@"^17.0.1" from the root project
npm WARN   28 more (@mdx-js/react, @next/react-dev-overlay, ...)
npm WARN
npm WARN Could not resolve dependency:
npm WARN peer react@"16.8.x" from [email protected]
npm WARN node_modules/react-spring/node_modules/react-konva
npm WARN   peer react-konva@">=16.8" from @react-spring/[email protected]
npm WARN   node_modules/react-spring/node_modules/@react-spring/konva
npm WARN ERESOLVE overriding peer dependency
npm WARN Found: [email protected]
npm WARN node_modules/react
npm WARN   react@"^17.0.1" from the root project
npm WARN   28 more (@mdx-js/react, @next/react-dev-overlay, ...)
npm WARN
npm WARN Could not resolve dependency:
npm WARN peer react@"^16.0.0" from [email protected]
npm WARN node_modules/react-spring/node_modules/react-dom
npm WARN   peer react-dom@"16.8.x" from [email protected]
npm WARN   node_modules/react-spring/node_modules/react-konva
npm WARN ERESOLVE overriding peer dependency
npm WARN Found: [email protected]
npm WARN node_modules/konva
npm WARN   peer konva@">=2.6" from @react-spring/[email protected]
npm WARN   node_modules/react-spring/node_modules/@react-spring/konva
npm WARN     @react-spring/konva@"~9.2.0-beta.0" from [email protected]
npm WARN     node_modules/react-spring
npm WARN
npm WARN Could not resolve dependency:
npm WARN peer konva@"^3.2.3" from [email protected]
npm WARN node_modules/react-spring/node_modules/react-konva
npm WARN   peer react-konva@">=16.8" from @react-spring/[email protected]
npm WARN   node_modules/react-spring/node_modules/@react-spring/konva
npm WARN ERESOLVE overriding peer dependency
npm WARN Found: [email protected]
npm WARN node_modules/react
npm WARN   react@"^17.0.1" from the root project
npm WARN   28 more (@mdx-js/react, @next/react-dev-overlay, ...)
npm WARN
npm WARN Could not resolve dependency:
npm WARN peer react@"17.0.1" from [email protected]
npm WARN node_modules/react-native
npm WARN   peer react-native@">=0.58" from @react-spring/[email protected]
npm WARN   node_modules/@react-spring/native
npm WARN ERESOLVE overriding peer dependency
npm WARN While resolving: [email protected]
npm WARN Found: [email protected]
npm WARN node_modules/react-dom
npm WARN   peerOptional react-dom@">=17.0" from @react-three/[email protected]
npm WARN   node_modules/@react-three/fiber
npm WARN     peer @react-three/fiber@">=6.0" from @react-spring/[email protected]
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/[email protected]
npm WARN node_modules/@react-three/fiber
npm WARN   peer @react-three/fiber@">=6.0" from @react-spring/[email protected]
npm WARN   node_modules/@react-spring/three
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! Found: [email protected]
npm ERR! node_modules/react
npm ERR!   react@"^17.0.1" from the root project
npm ERR!   peer react@"^16.13.1 || ^17.0.0" from @mdx-js/[email protected]
npm ERR!   node_modules/@mdx-js/react
npm ERR!     @mdx-js/react@"1.6.22" from @mdx-js/[email protected]
npm ERR!     node_modules/@mdx-js/loader
npm ERR!       @mdx-js/loader@"^1.6.22" from @storybook/[email protected]
npm ERR!       node_modules/@storybook/addon-docs
npm ERR!         dev @storybook/addon-docs@"^6.2.9" from the root project
npm ERR!     @mdx-js/react@"^1.6.22" from @storybook/[email protected]
npm ERR!     node_modules/@storybook/addon-docs
npm ERR!       dev @storybook/addon-docs@"^6.2.9" from the root project
npm ERR!   27 more (@next/react-dev-overlay, @storybook/addon-docs, ...)
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react@"^16.0.0" from [email protected]
npm ERR! node_modules/react-zdog/node_modules/react-reconciler
npm ERR!   react-reconciler@"^0.20.4" from [email protected]
npm ERR!   node_modules/react-zdog
npm ERR!     peer react-zdog@">=1.0" from @react-spring/[email protected]
npm ERR!     node_modules/@react-spring/zdog
npm ERR!       @react-spring/zdog@"~9.2.0-beta.0" from [email protected]
npm ERR!       node_modules/react-spring

[joshuaellis]

Thanks for letting me know, it'll be released in our next beta.