mui / material-ui

Material UI: Comprehensive React component library that implements Google's Material Design. Free forever.
https://mui.com/material-ui/
MIT License
94.03k stars 32.31k forks source link

Make `@mui/icons-material` independent from `@mui/material` in the future? #34489

Open michael-land opened 2 years ago

michael-land commented 2 years ago

Summary 💡

Are there any plan to make @mui/icons-material that not depends on @mui/material in the future?

I'm working on a side project that use @mui/joy. The auto import vscode intellisense sometime import components from @mui/material instead of @mui/joy.

I can't remove @mui/material because @mui/icon-material rely on that package.

Examples 🌈

No response

Motivation 🔦

Better DX and smaller bundle size.

siriwatknp commented 2 years ago

@xiaoyu-tamu Thanks for the feedback. We discussed this internally earlier about Joy UI feat. material-icons without having to install @mui/material.

Are there any plan to make @mui/icons-material that not depends on @mui/material in the future?

Sure! in Q4 of this year, I plan to tackle the integration between Joy UI and other MUI libraries to make sure that things are going smoothly before the stable release.

I will create a POC version and wait for upvotes first. At least the current status is not a blocker.

iandra-bedin-dh commented 1 year ago

Any updates on this? It is been more than 1 year.

siriwatknp commented 1 year ago

Any updates on this? It is been more than 1 year.

I am working on it in #35637

dannypk commented 11 months ago

Hey guys,

I got an issue when following the steps here https://mui.com/joy-ui/integrations/icon-libraries/ In GitLab CI/CD pipeline I get this error

yarn install v1.22.19
[1/4] Resolving packages...
[2/4] Fetching packages...
warning Pattern ["@mui/joy@^5.0.0-beta.18"] is trying to unpack in the same destination "/usr/local/share/.cache/yarn/v6/npm-@mui-material-5.0.0-beta.18-24f708a71bfa1c5b593290b202fb97e0f0f99143-integrity/node_modules/@mui/material" as pattern ["@mui/material@npm:@mui/joy@latest"]. This could result in non-deterministic behavior, skipping.
[3/4] Linking dependencies...
warning " > @mui/icons-material@5.15.0" has incorrect peer dependency "@mui/material@^5.0.0".
[4/4] Building fresh packages...
yarn run v1.22.19
...
Creating an optimized production build...
Failed to compile.
Module not found: Error: Can't resolve '@mui/joy' in '/builds/app/...

This only happens when the resolution of MUI uses the same version as JOY.

example of yarn.lock that fails (@mui/material resolution is the same version of @mui/joy)

"@mui/joy@^5.0.0-beta.18", "@mui/material@npm:@mui/joy@5.0.0-beta.18":
  version "5.0.0-beta.18"
  resolved "https://registry.yarnpkg.com/@mui/joy/-/joy-5.0.0-beta.18.tgz#24f708a71bfa1c5b593290b202fb97e0f0f99143"
  integrity sha512-TxEo7kqEnbjB5S8cyFrytWjzhxW12UxkEJOT0QM8WpwaBN3Ie1okFuo2bnFW94vYFZperW97/H/08cqqS/2JPA==
  dependencies:
    "@babel/runtime" "^7.23.5"
    "@mui/base" "5.0.0-beta.27"
    "@mui/core-downloads-tracker" "^5.15.0"
    "@mui/system" "^5.15.0"
    "@mui/types" "^7.2.11"
    "@mui/utils" "^5.15.0"
    clsx "^2.0.0"
    prop-types "^15.8.1"

example of yarn.lock that works (@mui/material resolution is different than the version of @mui/joy)

"@mui/joy@^5.0.0-beta.18":
  version "5.0.0-beta.18"
  resolved "https://registry.yarnpkg.com/@mui/joy/-/joy-5.0.0-beta.18.tgz#24f708a71bfa1c5b593290b202fb97e0f0f99143"
  integrity sha512-TxEo7kqEnbjB5S8cyFrytWjzhxW12UxkEJOT0QM8WpwaBN3Ie1okFuo2bnFW94vYFZperW97/H/08cqqS/2JPA==
  dependencies:
    "@babel/runtime" "^7.23.5"
    "@mui/base" "5.0.0-beta.27"
    "@mui/core-downloads-tracker" "^5.15.0"
    "@mui/system" "^5.15.0"
    "@mui/types" "^7.2.11"
    "@mui/utils" "^5.15.0"
    clsx "^2.0.0"
    prop-types "^15.8.1"

"@mui/material@npm:@mui/joy@5.0.0-beta.6":
  version "5.0.0-beta.6"
  resolved "https://registry.yarnpkg.com/@mui/joy/-/joy-5.0.0-beta.6.tgz#d515fd980ba3b0a323ebf9073fc5fbd90f25a549"
  integrity sha512-jDWPHSO0gLbnw1XUaWRSQEklV6sen7Ypmfil3MPyiOf1nA+WOC3SxD4S12Eky3lQeWMlNtf9Xg4P4s6GAHJSLw==
  dependencies:
    "@babel/runtime" "^7.22.15"
    "@mui/base" "5.0.0-beta.15"
    "@mui/core-downloads-tracker" "^5.14.9"
    "@mui/system" "^5.14.9"
    "@mui/types" "^7.2.4"
    "@mui/utils" "^5.14.9"
    clsx "^2.0.0"
    prop-types "^15.8.1"

I think having the resolution and the same version is the intended approach, nevertheless, that breaks the CI/CD pipeline.

Any suggestions? Thanks!

dannypk commented 8 months ago

Hey guys,

I got an issue when following the steps here https://mui.com/joy-ui/integrations/icon-libraries/ In GitLab CI/CD pipeline I get this error

yarn install v1.22.19
[1/4] Resolving packages...
[2/4] Fetching packages...
warning Pattern ["@mui/joy@^5.0.0-beta.18"] is trying to unpack in the same destination "/usr/local/share/.cache/yarn/v6/npm-@mui-material-5.0.0-beta.18-24f708a71bfa1c5b593290b202fb97e0f0f99143-integrity/node_modules/@mui/material" as pattern ["@mui/material@npm:@mui/joy@latest"]. This could result in non-deterministic behavior, skipping.
[3/4] Linking dependencies...
warning " > @mui/icons-material@5.15.0" has incorrect peer dependency "@mui/material@^5.0.0".
[4/4] Building fresh packages...
yarn run v1.22.19
...
Creating an optimized production build...
Failed to compile.
Module not found: Error: Can't resolve '@mui/joy' in '/builds/app/...

This only happens when the resolution of MUI uses the same version as JOY.

example of yarn.lock that fails (@mui/material resolution is the same version of @mui/joy)

"@mui/joy@^5.0.0-beta.18", "@mui/material@npm:@mui/joy@5.0.0-beta.18":
  version "5.0.0-beta.18"
  resolved "https://registry.yarnpkg.com/@mui/joy/-/joy-5.0.0-beta.18.tgz#24f708a71bfa1c5b593290b202fb97e0f0f99143"
  integrity sha512-TxEo7kqEnbjB5S8cyFrytWjzhxW12UxkEJOT0QM8WpwaBN3Ie1okFuo2bnFW94vYFZperW97/H/08cqqS/2JPA==
  dependencies:
    "@babel/runtime" "^7.23.5"
    "@mui/base" "5.0.0-beta.27"
    "@mui/core-downloads-tracker" "^5.15.0"
    "@mui/system" "^5.15.0"
    "@mui/types" "^7.2.11"
    "@mui/utils" "^5.15.0"
    clsx "^2.0.0"
    prop-types "^15.8.1"

example of yarn.lock that works (@mui/material resolution is different than the version of @mui/joy)

"@mui/joy@^5.0.0-beta.18":
  version "5.0.0-beta.18"
  resolved "https://registry.yarnpkg.com/@mui/joy/-/joy-5.0.0-beta.18.tgz#24f708a71bfa1c5b593290b202fb97e0f0f99143"
  integrity sha512-TxEo7kqEnbjB5S8cyFrytWjzhxW12UxkEJOT0QM8WpwaBN3Ie1okFuo2bnFW94vYFZperW97/H/08cqqS/2JPA==
  dependencies:
    "@babel/runtime" "^7.23.5"
    "@mui/base" "5.0.0-beta.27"
    "@mui/core-downloads-tracker" "^5.15.0"
    "@mui/system" "^5.15.0"
    "@mui/types" "^7.2.11"
    "@mui/utils" "^5.15.0"
    clsx "^2.0.0"
    prop-types "^15.8.1"

"@mui/material@npm:@mui/joy@5.0.0-beta.6":
  version "5.0.0-beta.6"
  resolved "https://registry.yarnpkg.com/@mui/joy/-/joy-5.0.0-beta.6.tgz#d515fd980ba3b0a323ebf9073fc5fbd90f25a549"
  integrity sha512-jDWPHSO0gLbnw1XUaWRSQEklV6sen7Ypmfil3MPyiOf1nA+WOC3SxD4S12Eky3lQeWMlNtf9Xg4P4s6GAHJSLw==
  dependencies:
    "@babel/runtime" "^7.22.15"
    "@mui/base" "5.0.0-beta.15"
    "@mui/core-downloads-tracker" "^5.14.9"
    "@mui/system" "^5.14.9"
    "@mui/types" "^7.2.4"
    "@mui/utils" "^5.14.9"
    clsx "^2.0.0"
    prop-types "^15.8.1"

I think having the resolution and the same version is the intended approach, nevertheless, that breaks the CI/CD pipeline.

Any suggestions? Thanks!

still no updates?

zacronos commented 4 months ago

Am I correct that without removing the dependency on @mui/material, it's impossible to use JoyUI, Material Icons, and components from MUI X (such as DataGrid) all together?

Using JoyUI + Material Icons requires the package-manager resolution hack to make @mui/material resolve to @mui/joy, but this seems to break MUI X components (which depend on @mui/material and I guess can't use JoyUI instead the way Material Icons can).