NPM V7 and Grouparoo - Unable to resolve dependency tree

[evantahler]

With the release of NPM v7x, the way that peerDependencies are handled has changed.

NPM now will throw an error if there's a conflicting or unresolvable package in the tree.

npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree

For Grouparoo, this happens in 2 places. specifically related to our UI packages and conflicting peerDependencies on different versions of react (v16 vs v17):

@nivo/core uses
  @nivo/colors: suspect <= 17.0.0
  recompose: "^0.14.0 || ^15.0.0 || ^16.0.0"

react-bootstrap-typeahead uses
  react-popper: "0.14.x || ^15.0.0 || ^16.0.0"

The full error you recieve on `npm install` looks something like this (click to expand)

➜  grouparoo npm install
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! Found: react@16.14.0
npm ERR! node_modules/react
npm ERR!   react@"17.0.1" from @grouparoo/ui-community@0.2.0-alpha.21
npm ERR!   node_modules/@grouparoo/ui-community
npm ERR!     @grouparoo/ui-community@"/Users/evan/workspace/grouparoo/grouparoo/ui/ui-community/grouparoo-ui-community-0.2.0-alpha.21.tgz" from the root project
npm ERR!   peer react@"^16.6.0 || ^17" from ah-next-plugin@0.5.0
npm ERR!   node_modules/ah-next-plugin
npm ERR!     ah-next-plugin@"0.5.0" from @grouparoo/core@0.2.0-alpha.21
npm ERR!     node_modules/@grouparoo/core
npm ERR!       @grouparoo/core@"/Users/evan/workspace/grouparoo/grouparoo/core/grouparoo-core-0.2.0-alpha.21.tgz" from the root project
npm ERR!   29 more (next, @fortawesome/react-fontawesome, @nivo/core, ...)
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react@"17.0.1" from react-dom@17.0.1
npm ERR! node_modules/react-dom
npm ERR!   react-dom@"17.0.1" from @grouparoo/ui-community@0.2.0-alpha.21
npm ERR!   node_modules/@grouparoo/ui-community
npm ERR!     @grouparoo/ui-community@"/Users/evan/workspace/grouparoo/grouparoo/ui/ui-community/grouparoo-ui-community-0.2.0-alpha.21.tgz" from the root project
npm ERR!   peer react-dom@"^16.6.0 || ^17" from ah-next-plugin@0.5.0
npm ERR!   node_modules/ah-next-plugin
npm ERR!     ah-next-plugin@"0.5.0" from @grouparoo/core@0.2.0-alpha.21
npm ERR!     node_modules/@grouparoo/core
npm ERR!       @grouparoo/core@"/Users/evan/workspace/grouparoo/grouparoo/core/grouparoo-core-0.2.0-alpha.21.tgz" from the root project
npm ERR!   3 more (next, react-bootstrap, react-bootstrap-typeahead)
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/evan/.npm/eresolve-report.txt for a full report.

Short term mitigations:

• recommended: Use the grouparoo cli to manage your project (ie: npx grouparoo install). We will apply the --legacy-peer-deps flag if needed
• If you use npm to manage your Grouparoo application, and you use NPM v6, no change is needed
• If you use npm to manage your Grouparoo application, and you use NPM v7, you can add the --legacy-peer-deps flag when you use npm install and things will continue to work as they have

Long term mitigations:

• Grouparoo will work with the maintainers of the UI packages we use to upgrade them to work with react v17. Or, we will switch to another UI package that already does.

Misc

• You can learn which version of NPM you are using with npm --version

[evantahler]

This may also manifest itself with errors like cannot find {plugin}. If you see errors like this, give npm install --legacy-peer-deps a try.

The grouparoo CLI command will do this for you under the hood.