Material-ui-pickers: can't build with yarn 2

[bbigras]

Environment

| Tech | Version |
| -------------------- | ------- |
| @material-ui/pickers | 3.2.10 |
| material-ui | 4.9.12 |
| TypeScript | 3.7.2 |
| React | 16.13.1 |
| Browser | |
| Peer library | date-fns 2.12.0 | |

Steps to reproduce

1. mkdir test
2. cd test
3. yarn set version berry
4. yarn dlx create-react-app my-app --template typescript
5. cd my-app
6. yarn add @material-ui/core
7. yarn add @material-ui/pickers @date-io/[email protected] date-fns
8. add a date picker or something to App.tsx
9. yarn start

I tried to set the following in .yarnrc but with no success:

packageExtensions:
  "@material-ui/pickers@*":
    peerDependencies:
      "prop-types": "*"

Expected behavior

Actual behavior

Failed to compile.

./.yarn/$$virtual/@material-ui-pickers-virtual-3136547978/0/cache/@material-ui-pickers-npm-3.2.10-2d3cf5f048-2.zip/node_modules/@material-ui/pickers/esm/Calendar-11ae61f6.js
Module not found: @material-ui/pickers tried to access prop-types (a peer dependency) but it isn't provided by its ancestors; this makes the require call ambiguous and unsound.

Live example

[oliviertassinari]

@bbigras We have moved our effort to the next branch (v4.0.0-alpha.5 as we are speaking), can you reproduce with the next version?

[bbigras]

Yes I still have this with 4.0.0-alpha.5:

./.yarn/cache/jss-plugin-rule-value-function-npm-10.1.1-f63c97f8af-2.zip/node_modules/jss-plugin-rule-value-function/dist/jss-plugin-rule-value-function.esm.js
Module not found: jss-plugin-rule-value-function tried to access tiny-warning, but it isn't declared in its dependencies; this makes the require call ambiguous and unsound.

Thanks a lot for pointing me in the right direction, and you time. Merci.

[oliviertassinari]

@bbigras Which duplicate with https://github.com/mui-org/material-ui/issues/20797 and https://github.com/cssinjs/jss/issues/1313. Happy to hear we have no other issues with @material-ui/[email protected] :)

[bbigras]

:+1:

and if someone else has the same problem, this seems to work:

EDIT: I think you need to run yarn after the edit.

.yarnrc.yml

yarnPath: ".yarn/releases/yarn-berry.js"
packageExtensions:
  "@material-ui/pickers@*":
    dependencies:
      "prop-types": "*"
  "jss-plugin-rule-value-function@*":
    dependencies:
      "tiny-warning": "*"

[jozsi]

I am having a similar issue with v4.0.0-alpha.5:
Module not found: @date-io/date-fns tried to access date-fns (a peer dependency) but it isn't provided by its ancestors; this makes the require call ambiguous and unsound.

➤ YN0002: │ @material-ui/pickers@npm:4.0.0-alpha.5 [08760] doesn't provide date-fns@^2.0.0 requested by @date-io/date-fns@npm:2.6.1
➤ YN0002: │ @material-ui/pickers@npm:4.0.0-alpha.5 [08760] doesn't provide dayjs@^1.8.17 requested by @date-io/dayjs@npm:2.6.0
➤ YN0002: │ @material-ui/pickers@npm:4.0.0-alpha.5 [08760] doesn't provide luxon@^1.21.3 requested by @date-io/luxon@npm:2.6.0
➤ YN0002: │ @material-ui/pickers@npm:4.0.0-alpha.5 [08760] doesn't provide moment@^2.24.0 requested by @date-io/moment@npm:2.6.0

The following fixed it for me (thank you @bbigras):

yarnPath: .yarn/releases/yarn-sources.js
packageExtensions:
  '@material-ui/pickers@*':
    dependencies:
      'date-fns': '*'

[oliviertassinari]

@jozsi You need to install date-fns.

[jozsi]

@oliviertassinari - it is installed, I even moved it as a peer dependency :) moving it back as a normal dependency doesn't help either (unlike with react and react-dom), so the only working solution I found, yet, is in the comment marked as off-topic.

[mstoil]

As @bbigras mentioned, just inserted the "jss-plugin-rule-value-function@*" dependency in the .yarnrc.yml , re-runned yarn and it works.

[oliviertassinari]

The missing dependency on JSS side was fixed in v10.2.0, the prop type warning was fixed in the v4, alpha release of the picker. We can close.

[TOcvfan]

Am I doing something wrong since you have closed this and I get this error:
Module not found: @material-ui/pickers tried to access prop-types (a peer dependency) but it isn't provided by your application; this makes the require call ambiguous and unsound

this is my dependencies
"@date-io/date-fns": "1.3.11", "@hookform/resolvers": "0.1.0", "@material-ui/core": "4.9.8", "@material-ui/icons": "^4.9.1", "@material-ui/pickers": "^3.2.10", "date-fns": "2.11.1", "react": "^16.14.0", "react-dom": "^16.14.0", "react-hook-form": "^6.9.5", "react-scripts": "3.4.3"

where do you find the .yarnrc.yml file??
I'm at a lose here..

[oliviertassinari]

The problem is already fixed in @material-ui/[email protected].

[TOcvfan]

No I already tried that and I got the same error, but going back to npm fixed it, so my conclusion is don't use yarn..

[oliviertassinari]

https://unpkg.com/@material-ui/pickers@4.0.0-alpha.12/package.json

[TOcvfan]

I still got the error with yarn I tried 4.0.0-alpha.12 and latest and next but none of them worked but I guess I just imagined it, and then I just imagined I used yarn at all, it clearly doesn't work anyway..