makeStyles not found since v5.0.0-alpha.35

[essuraj]

makeStyles not found since v5.0.0-alpha.35 and no clarity on any migration strategy, the whole code base is filled with makeStyles and unsure of how to migrate them to beta, any pointers?

[mnajdova]

Did you look at https://next.material-ui.com/guides/migration-v4/#material-ui-core-styles?

[mnajdova]

This may be relevant too #20012

[siriwatknp]

@essuraj if you could wait until this PR #27032 is merged. It could help reduce your migration work.

[oliviertassinari]

no clarity on any migration strategy

Should we add these modules back in v5, with an explicit error for those that try to call them?

import MuiError from '@material-ui/utils/macros/MuiError.macro';

throw new MuiError([
  'Material-UI: x is not longer exported from @material-ui/core.',
  'You have to import it from @material-ui/styles.',
  'See https://material-ui.com/r/migration-v4/#material-ui-core-styles for more details.',
].join('\n'));

This will help the busy developers that don't have the time to read in detail the migration guide. With the link, they would find the codemod.

[mnajdova]

Should we add these modules back in v5, with an explicit error for those that try to call them?

Let’s do it!

[jrhager84]

Consulting the docs, I am unable to import makeStyles (per docs) on v5.0.0-beta 0 | '@material-ui/styles'

How should I be importing makeStyles now?

[oliviertassinari]

@jrhager84. Did you install @material-ui/[email protected]?

[jrhager84]

@jrhager84. Did you install @material-ui/[email protected]?

I did eventually, but the documentation is extremely nebulous about the requirements. I'm trying to find where it said, but it basically said it was broken out of /core, and unless you plan on using the themes outsides of Mui, to install the /styles package. I'll try to dig up where I saw it. I can't immediately find it presently.

[Quozzo]

@jrhager84. Did you install @material-ui/[email protected]?

I did eventually, but the documentation is extremely nebulous about the requirements. I'm trying to find where it said, but it basically said it was broken out of /core, and unless you plan on using the themes outsides of Mui, to install the /styles package. I'll try to dig up where I saw it. I can't immediately find it presently.

It is here were the warning specifies to install @material-ui/styles which causes issues with makeStyles since the theme is not within the same context and the theme argument comes back as an empty object.

const useStyles = makeStyles(theme => {
   console.log(theme) // {}
   return {...}
})

Installing @material-ui/[email protected] solved the issue for me.

[alexander-larsson]

Installing @material-ui/[email protected] solved the issue for me.

Thank god I found this. I didn't realize there was a new version of @material-ui/styles for v5.0.0. Maybe you should make this more clear in the migration guide?

[oliviertassinari]

@mnajdova Maybe we shouldn't wait for a community member to take on this issue and implement #27216 (comment) now?

[jtgi]

Lost on an hour on this one 😅

Suggested documentation improvements related to the issue, on page https://next.material-ui.com/styles/basics/#installation

1. While under the next subdomain, this should suggest installing @material-ui/styles@next, if you just install @material-ui/styles you'll pick up v4, which will silently break theming (empty theme obj, etc.).

2. It says under a yellow sticky:
   @material-ui/styles is re-exported as @material-ui/core/styles - you only need to install it if you wish to use it independently from Material-UI. This is not true. If you are making use of makeStyles you must install @material-ui/styles.

3. This one more of an opinion, but I believe ThemeProvider is now always required? If so, I believe this section should move up: https://next.material-ui.com/styles/basics/#using-the-theme-context.

[mnajdova]

@mnajdova Maybe we shouldn't wait for a community member to take on this issue and implement #27216 (comment) now?

will do it on Monday 👍

[oliviertassinari]

@jtgi Thanks for the extra feedback. It does seem that we have more improvements opportunities, 👍 for these 3 points.

[jrhager84]

Lost on an hour on this one 😅

Suggested documentation improvements related to the issue, on page https://next.material-ui.com/styles/basics/#installation

1. While under the next subdomain, this should suggest installing @material-ui/styles@next, if you just install @material-ui/styles you'll pick up v4, which will silently break theming (empty theme obj, etc.).
2. It says under a yellow sticky:
   @material-ui/styles is re-exported as @material-ui/core/styles - you only need to install it if you wish to use it independently from Material-UI. This is not true. If you are making use of makeStyles you must install @material-ui/styles.
3. This one more of an opinion, but I believe ThemeProvider is now always required? If so, I believe this section should move up: https://next.material-ui.com/styles/basics/#using-the-theme-context.

This is the place I was referring to. It made it seem as though if you were using MUI, you wouldn't have to install the styles module, as you'd only have to do that if you were only using the styling.

[dandrei]

Using 5.0.0-beta.2 and I still have access to makeStyles. The legacy styling code will be completely removed by the time the stable version is released, correct?