How to import makeStyles from mui?

Viewed 14472

I am using Material Ui version 5.2.7. When I import makeStyles from @mui/materials/styles, I am getting following error -

Uncaught Error: MUI: makeStyles is not longer exported from @mui/material/styles. You have to import it from @mui/styles. See https://mui.com/r/migration-v4/#material-ui-core-styles for more details.

At also says that @mui/styles is deprecated in mui version 5. So I am confused how I can import makeStyles. Anyone have any idea on this?

3 Answers

As you can see in documentation, using makeStyles is deprecated now in MUI as a concept, because they dont want to use JSS anymore, instead they suggest to use emotion/react library or styled components

instead of makeStyles you can just create object with styles ( style={your styles} ) inside functional component and then use sx property( sx={style} ) on MUI component inside that functional component.

I came across this thread. I know this is a bit old but you can still use makeStyles in mui v5 using this import (will be deprecated):

import makeStyles from '@mui/styles/makeStyles';

This is automatically updated if you run their codemod from their documentation migrating from V4 to V5: Mui Codemod

Related