[bug]: React Spring cannot be installed with React 17 with strict peer dependency checking

[21echoes]

Which react-spring target are you using?

• [ ] @react-spring/web
• [ ] @react-spring/three
• [ ] @react-spring/native
• [X] @react-spring/konva
• [ ] @react-spring/zdog

What version of react-spring are you using?

^9.4.4

What's Wrong?

@react-spring/konva cannot be installed with react@17 with strict peer dependency mode enabled.

@react-spring/[email protected] requires react-konva@^16.8.0 || ^17.0.0. However, no package satisfying react-konva@^16.8.0 || ^17.0.0 exists, because react-konva has not released an official ^17.0.0 yet, only pre-releases e.g. 17.0.2-5. Installing react-konva@^16.8.0, of course, fails peer dependencies with react@17.

To Reproduce

Make a new empty folder, add a package.json with:

{
    "name": "react-spring-test",
    "version": "0.0.1",
    "private": true,
    "devDependencies": {
        "@react-spring/konva": "^9.4.4",
        "react": "^17.0.0"
    }
}

and run npm install --strict-peer-deps

Expected Behaviour

npm install --strict-peer-deps should succeed

Link to repo

https://github.com/21echoes/react-spring-react-17-test

[joshuaellis]

I've answered this a few times, I wouldn't install the general react-spring package, instead install the targets you want specifically e.g. @react-spring/web

[21echoes]

@joshuaellis this still fails if you install the specific @react-spring/konva target. i've updated the sample repo to make this clear

[joshuaellis]

I would still be installing @react-spring/konva instead of react-spring in your case then.

[21echoes]

yes, exactly -- in my case, i am installing @react-spring/konva and not react-spring, and it fails.

[joshuaellis]

Sorry, I thought you had updated the repo. So you're saying the peer-dep of react in @react-spring/konva is incorrect because you can't use v17+ because react-konva doesn't support technically support v17?

So until react-konva releases their version that supports 17+ we should just stick to ^16.8.0 for react?

You're welcome to submit a PR to resolve this issue.

[davbrito]

Hi. I'm having then same issue.

[joshuaellis]

Hi. I'm having then same issue.

@21echoes see the above comment

[davbrito]

I think actually react-konva does support react v17 in the stable channel. But they use a weird version schema that npm seems to not understand very well (at the moment the latest version is 17.0.2-6, note it's not beta nor alpha nor rc).

Then I don't know what would be the actual solution to the problem. Sticking to ^16.8.0 for react would be more problem than a solution since many projects are using react 17 so that would break those.

[davbrito]

I think that changing this https://github.com/pmndrs/react-spring/blob/d8dd9c12a5db8989655f5edca6f63123189c3b6a/targets/konva/package.json#L38 To something like "^16.8.0 || ^17.0.0 || ^17.0.2-4" should solve the problem.

As they do on react-konva-utils https://github.com/konvajs/react-konva-utils/blob/fe3e88b4264b1cac366876aca4d78a2490afa95a/package.json#L14

[lavrton]

I think actually react-konva does support react v17 in the stable channel

Yes. The last stable version for react@17 is 17.0.2-6

But they use a weird version schema that npm seems to not understand very well (at the moment the latest version is 17.0.2-6, note it's not beta nor alpha nor rc).

Yes, it is weird. I decided to use it to follow react and react-dom version with ability to have our own subversion. But I was not aware that npm doesn't understand it well (or I misunderstand it). I will need to rethink the approach.

"^16.8.0 || ^17.0.0 || ^17.0.2-4" - I think that should work just fine.

[joshuaellis]

Lets take this instance ^16.8.0 || ^17.0.0 || ^17.0.1-0, this is difficult because it does not include versions 17.0.2-0 and above, even though it would normally if there were no -X. So whilst the suggestion will work, I'd actually have to currently write:

^16.8.0 || ^16.8.7-0 || ^16.9.0-0 || ^16.10.1-0 || ^16.12.0-0 || ^16.13.0-0 || ^17.0.0-0 || ^17.0.1-0 || ^17.0.2-0 || ^18.0.0-0

to successfully capture all the versions that have been published... see below:

Maybe there's a syntax that will capture them all that i'm not aware of?

[momesana]

Lets take this instance ^16.8.0 || ^17.0.0 || ^17.0.1-0, this is difficult because it does not include versions 17.0.2-0 ...

@joshuaellis, the releases where the patch-version is followed by a hyphen and a digit are pre-releases. Supporting pre-releases of peer-dependencies should be out of scope of this project. I'd rather see a stable release like react-18 that has been out for months be properly supported without npm flooding the build logs with errors.

and above, even though it would normally if there were no -X.

That's not entirely true. 16.8.2-0 is not supported as it is a pre-release, 16.8.2 however as the corresponding stable version is; 16.8.3-0 is not supported but 16.8.3, 16.8.4 etc are. Furthermore, not capturing pre-releases in npm (unless explicitly specified in the semver range) has very likely been a deliberate decision.

[joshuaellis]

Thanks for the input @momesana

followed by a hyphen and a digit are pre-releases.

But as you'd see above the maintainer of react-konva was actually using the hyphons as a way to keep inline with the react version whilst allowing a subversion for their own maintenance. Looking at the repo, they've gone back to traditional semver, so feel free to open a PR if you wish to see this resolved.

I'd recommend this tool https://semver.npmjs.com/ to check your implementation.

[tyfiero]

I'm having this issue as well.