High number of installation warnings - vite

[MikeMcC399]

• This follows on from issue High number of installation warnings #1329 for the previous configuration using CRA, which has been replaced by vite.

Description

Running yarn install produces a large number of warnings.

• @material-ui/core - deprecated
• @material-ui/icons@4.11.3
• @material-ui/lab - deprecated
• @xstate/react@2.0.1
• aws-amplify
• react-google-login@ - deprecated
• react-infinite-calendar@2.3.1
• @babel/plugin-proposal-private-property-in-object - deprecated
• @cypress/code-coverage
• @cypress/webpack-dev-server@1.8.4 - should not need to be installed separately
• @percy/cypress@2.3.4
• eslint-config-react-app
• express-graphql - deprecated

Steps to reproduce

Clone repo and execute the following under Node.js 18.16.1:

git clean -x -d -f
yarn install

Expectation

There should be no installation warnings produced by yarn install.

Logs

Clean install

$ node -v
v18.16.1

$ yarn install
yarn install v1.22.19
[1/5] Validating package.json...
[2/5] Resolving packages...
[3/5] Fetching packages...
[4/5] Linking dependencies...
warning " > @material-ui/core@4.12.4" has incorrect peer dependency "react@^16.8.0 || ^17.0.0".
warning " > @material-ui/core@4.12.4" has incorrect peer dependency "react-dom@^16.8.0 || ^17.0.0".
warning "@material-ui/core > @material-ui/styles@4.11.5" has incorrect peer dependency "react@^16.8.0 || ^17.0.0".
warning "@material-ui/core > @material-ui/styles@4.11.5" has incorrect peer dependency "react-dom@^16.8.0 || ^17.0.0".
warning "@material-ui/core > @material-ui/system@4.12.2" has incorrect peer dependency "react@^16.8.0 || ^17.0.0".
warning "@material-ui/core > @material-ui/system@4.12.2" has incorrect peer dependency "react-dom@^16.8.0 || ^17.0.0".
warning "@material-ui/core > @material-ui/utils@4.11.3" has incorrect peer dependency "react@^16.8.0 || ^17.0.0".
warning "@material-ui/core > @material-ui/utils@4.11.3" has incorrect peer dependency "react-dom@^16.8.0 || ^17.0.0".
warning " > @material-ui/icons@4.11.3" has incorrect peer dependency "react@^16.8.0 || ^17.0.0".
warning " > @material-ui/icons@4.11.3" has incorrect peer dependency "react-dom@^16.8.0 || ^17.0.0".
warning " > @material-ui/lab@4.0.0-alpha.61" has incorrect peer dependency "react@^16.8.0 || ^17.0.0".
warning " > @material-ui/lab@4.0.0-alpha.61" has incorrect peer dependency "react-dom@^16.8.0 || ^17.0.0".
warning " > @xstate/react@2.0.1" has incorrect peer dependency "react@^16.8.0 || ^17.0.0".
warning "aws-amplify > @aws-amplify/core > react-native-url-polyfill@1.3.0" has unmet peer dependency "react-native@*".
warning "aws-amplify > @aws-amplify/analytics > @aws-sdk/client-firehose > @aws-sdk/middleware-retry > react-native-get-random-values@1.9.0" has unmet peer dependency "react-native@>=0.56".
warning " > react-google-login@5.2.2" has incorrect peer dependency "react@^16 || ^17".
warning " > react-google-login@5.2.2" has incorrect peer dependency "react-dom@^16 || ^17".
warning " > react-infinite-calendar@2.3.1" has incorrect peer dependency "react@^15.3.0 || ^16.0.0-alpha".
warning "react-infinite-calendar > react-tiny-virtual-list@2.2.0" has incorrect peer dependency "react@15.x || 16.x".
warning "react-infinite-calendar > react-transition-group@1.2.1" has incorrect peer dependency "react@^15.0.0 || ^16.0.0".
warning "react-infinite-calendar > react-transition-group@1.2.1" has incorrect peer dependency "react-dom@^15.0.0 || ^16.0.0".
warning "react-infinite-calendar > recompose@0.22.0" has incorrect peer dependency "react@^0.14.0 || ^15.0.0".
warning " > @babel/plugin-proposal-private-property-in-object@7.21.11" has unmet peer dependency "@babel/core@^7.0.0-0".
warning "@babel/plugin-proposal-private-property-in-object > @babel/helper-create-class-features-plugin@7.22.6" has unmet peer dependency "@babel/core@^7.0.0".
warning "@babel/plugin-proposal-private-property-in-object > @babel/plugin-syntax-private-property-in-object@7.14.5" has unmet peer dependency "@babel/core@^7.0.0-0".
warning "@cypress/code-coverage > @cypress/webpack-preprocessor@5.17.1" has unmet peer dependency "@babel/core@^7.0.1".
warning "@cypress/code-coverage > @cypress/webpack-preprocessor@5.17.1" has unmet peer dependency "@babel/preset-env@^7.0.0".
warning "@cypress/code-coverage > @cypress/webpack-preprocessor@5.17.1" has unmet peer dependency "babel-loader@^8.0.2 || ^9".
warning "@cypress/code-coverage > @cypress/webpack-preprocessor@5.17.1" has unmet peer dependency "webpack@^4 || ^5".
warning " > @cypress/webpack-dev-server@1.8.4" has unmet peer dependency "html-webpack-plugin@>=4".
warning " > @cypress/webpack-dev-server@1.8.4" has unmet peer dependency "webpack@>=4".
warning " > @cypress/webpack-dev-server@1.8.4" has unmet peer dependency "webpack-dev-server@>=3.0.0".
warning " > @percy/cypress@2.3.4" has incorrect peer dependency "cypress@^3 || ^4 || ^5 || ^6".
warning "eslint-config-react-app > eslint-plugin-flowtype@8.0.3" has unmet peer dependency "@babel/plugin-syntax-flow@^7.14.5".
warning "eslint-config-react-app > eslint-plugin-flowtype@8.0.3" has unmet peer dependency "@babel/plugin-transform-react-jsx@^7.14.9".
warning " > express-graphql@0.12.0" has incorrect peer dependency "graphql@^14.7.0 || ^15.3.0".
warning Workspaces can only be enabled in private projects.
[5/5] Building fresh packages...
$ husky install && patch-package
husky - Git hooks installed
patch-package 7.0.0
Applying patches...
@material-ui/core@4.12.4 ✔
react-virtualized@9.22.5 ✔
Done in 275.42s.

Repeat install

$ yarn install
yarn install v1.22.19
[1/5] Validating package.json...
[2/5] Resolving packages...
success Already up-to-date.
$ husky install && patch-package
husky - Git hooks installed
patch-package 7.0.0
Applying patches...
@material-ui/core@4.12.4 ✔
react-virtualized@9.22.5 ✔
Done in 0.93s.

[astone123]

@MikeMcC399 I took a look at this today. In order to resolve these warnings, it looks like we need to do the following:

• Upgrade Material UI packages to v5
• Upgrade @xstate/react to 3.0.0
• Move to a new package for react-google-login as it's no longer maintained and stuck on React 16/17 peer dependencies. Looks like someone forked it and released a version with React 18 peer deps here, might be able to use that
• Similarly, migrate off of react-infinite-calendar which appears to be unmaintained as well, so its peer dependencies for React are stuck
• Add unmet peer dependencies (@babel/core@7.0.0, react-native for aws-amplify, webpack, etc)
• Uninstall @cypress/webpack-dev-server (I don't think we need it anymore)
• Migrate from express-graphql to graphql-http

As you can tell, most of these were caused by upgrading to React 18 and not updating other packages to get the updated peer dependencies. Some of these changes are pretty straightforward, but things like the Material UI migration is going to be a pretty heavy lift. This work will likely need to be broken out across multiple issues.

[MikeMcC399]

@astone123

It's great you've identified the items to tackle. I only got as far as assessing that it was complex and too difficult for me to fix! 😃

[astone123]

I created separate issues for the things that I didn't resolve in #1417

• Migrate away from express-graphql package #1420
• Migrate to MUI v5 #1418
• Migrate away from react-infinite-calendar #1419

[MikeMcC399]

@astone123

• Good progress in chore: fix some peer dependency warnings #1417!

Is the remaining aws-amplify warning covered by your new issues listed in #1403 (comment) above ^^?

$ yarn
yarn install v1.22.19
[1/5] Validating package.json...
[2/5] Resolving packages...
[3/5] Fetching packages...
[4/5] Linking dependencies...
warning " > @material-ui/core@4.12.4" has incorrect peer dependency "react@^16.8.0 || ^17.0.0".
warning " > @material-ui/core@4.12.4" has incorrect peer dependency "react-dom@^16.8.0 || ^17.0.0".
warning "@material-ui/core > @material-ui/styles@4.11.5" has incorrect peer dependency "react@^16.8.0 || ^17.0.0".
warning "@material-ui/core > @material-ui/styles@4.11.5" has incorrect peer dependency "react-dom@^16.8.0 || ^17.0.0".
warning "@material-ui/core > @material-ui/system@4.12.2" has incorrect peer dependency "react@^16.8.0 || ^17.0.0".
warning "@material-ui/core > @material-ui/system@4.12.2" has incorrect peer dependency "react-dom@^16.8.0 || ^17.0.0".
warning "@material-ui/core > @material-ui/utils@4.11.3" has incorrect peer dependency "react@^16.8.0 || ^17.0.0".
warning "@material-ui/core > @material-ui/utils@4.11.3" has incorrect peer dependency "react-dom@^16.8.0 || ^17.0.0".
warning " > @material-ui/icons@4.11.3" has incorrect peer dependency "react@^16.8.0 || ^17.0.0".
warning " > @material-ui/icons@4.11.3" has incorrect peer dependency "react-dom@^16.8.0 || ^17.0.0".
warning " > @material-ui/lab@4.0.0-alpha.61" has incorrect peer dependency "react@^16.8.0 || ^17.0.0".
warning " > @material-ui/lab@4.0.0-alpha.61" has incorrect peer dependency "react-dom@^16.8.0 || ^17.0.0".
warning "aws-amplify > @aws-amplify/core > react-native-url-polyfill@1.3.0" has unmet peer dependency "react-native@*".
warning "aws-amplify > @aws-amplify/analytics > @aws-sdk/client-firehose > @aws-sdk/middleware-retry > react-native-get-random-values@1.9.0" has unmet peer dependency "react-native@>=0.56".
warning " > react-infinite-calendar@2.3.1" has incorrect peer dependency "react@^15.3.0 || ^16.0.0-alpha".
warning "react-infinite-calendar > react-tiny-virtual-list@2.2.0" has incorrect peer dependency "react@15.x || 16.x".
warning "react-infinite-calendar > react-transition-group@1.2.1" has incorrect peer dependency "react@^15.0.0 || ^16.0.0".
warning "react-infinite-calendar > react-transition-group@1.2.1" has incorrect peer dependency "react-dom@^15.0.0 || ^16.0.0".
warning "react-infinite-calendar > recompose@0.22.0" has incorrect peer dependency "react@^0.14.0 || ^15.0.0".
warning "@cypress/code-coverage > @cypress/webpack-preprocessor@5.17.1" has unmet peer dependency "@babel/preset-env@^7.0.0".
warning "@cypress/code-coverage > @cypress/webpack-preprocessor@5.17.1" has unmet peer dependency "babel-loader@^8.0.2 || ^9".
warning " > express-graphql@0.12.0" has incorrect peer dependency "graphql@^14.7.0 || ^15.3.0".
warning Workspaces can only be enabled in private projects.
[5/5] Building fresh packages...
$ husky install && patch-package
husky - Git hooks installed
patch-package 7.0.0
Applying patches...
@material-ui/core@4.12.4 ✔
react-virtualized@9.22.5 ✔
Done in 162.49s.

[astone123]

@MikeMcC399 it is not... I'm not sure what to do about that one. Installing react-native adds other warnings to the list

[MikeMcC399]

• Follow up to this issue is now posted to Installation warnings Rev3 #1508