decap-cms: netlify-cms-app fails to install with react 17 as version 6 of react-aria-menubutton in incompatible with react 17
Describe the bug
When installing netlify-cms-app with react 17 the install fails with the following error:
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! Found: react@17.0.2
npm ERR! node_modules/react
npm ERR! peer react@"17.0.2" from react-dom@17.0.2
npm ERR! node_modules/react-dom
npm ERR! react-dom@"^17.0.2" from the root project
npm ERR! peer react-dom@"^16.8.4 || ^17.0.0" from netlify-cms-app@2.15.6
npm ERR! node_modules/netlify-cms-app
npm ERR! netlify-cms-app@"*" from the root project
npm ERR! 8 more (netlify-cms-widget-date, ...)
npm ERR! react@"^17.0.2" from the root project
npm ERR! 38 more (netlify-cms-app, @emotion/core, @emotion/styled, ...)
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react@"0.14.x || ^15.0.0 || ^16.0.0" from react-aria-menubutton@6.3.0
npm ERR! node_modules/netlify-cms-ui-default/node_modules/react-aria-menubutton
npm ERR! react-aria-menubutton@"^6.0.0" from netlify-cms-ui-default@2.13.1
npm ERR! node_modules/netlify-cms-ui-default
npm ERR! netlify-cms-ui-default@"^2.13.1" from netlify-cms-app@2.15.6
npm ERR! node_modules/netlify-cms-app
npm ERR! netlify-cms-app@"*" from the root project
npm ERR! 23 more (netlify-cms-backend-azure, ...)
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!
It seems like react-aria-menubutton in netlify-cms-ui-default needs to be upgraded to version 7.0.1 see: https://github.com/davidtheclark/react-aria-menubutton/issues/140
To Reproduce
Run npm init -y && npm i react react-dom && npm i netlify-cms-app in an empty directory.
See Error
Expected behavior
netlify-cms-app installs without having to use --legacy-peer-deps
Screenshots
NA
Applicable Versions:
- Netlify CMS version: 2.15.6
- Git provider: NA
- OS: Arch Linux
- Browser version NA
- NPM version: 7.12.1
- Node.JS version: 16.1.0
CMS configuration
NA
Additional context
Seems like a dependency that didn’t get updated while fixing https://github.com/netlify/netlify-cms/issues/5111
About this issue
- Original URL
- State: open
- Created 3 years ago
- Reactions: 2
- Comments: 19 (6 by maintainers)
Looks great! I hope you find it useful and that I didn’t leave anything out of the original work.
@erezrokah Sounds great! I’m working on that right now in this fork https://github.com/LuisOsta/netlify-cms based on the version created by @JeremyGrieshop.
Btw Jeremy let me know if the attribution I included in the commit looks good to you (I included the README and a link to your repository)
Here’s an example I quickly pushed to my personal repository that someone could copy into their own
SplitPanefolder. I converted over some of the older class dependencies and made them functional components that use hooks instead:https://github.com/JeremyGrieshop/react-split-pane
I don’t have a public repository to share at this moment, but I just copied these 4 files into a local directory, called
SplitPanein my project and imported from it instead ofreact-split-pane:https://github.com/tomkp/react-split-pane/tree/master/src
It does, at this time, require a polyfil, so you’ll need to add
react-lifecycles-compatas a dependency for now. If these are ever converted over to class-less components/hooks, then it won’t be necessary. It also requiredreact-style-proptype, but I just removed that code from the appropriate classes, since I didn’t care about the prop types. Otherwise, you’d need to add that dependency as well.Woo @shirshendubhowmick, this is amazing. Thank you for the quick follow up ❤️
This is now complete