Changing all import statements for MUI v5

Viewed 493

I'm learning react right now and have a pretty large project using MUI and with v5 the package name changed from @material-ui/core to @mui/material. I know this is simple but is there a better way than manually changing all my import lines from import x from "@material-ui/core/x" to import x from "@mui/material/x". Any help is appreciated I've spent too much time on this and MUI docs/release notes are no help on this issue.

2 Answers

MUI team wrote some codemods to help you transition from v4 to v5 more smoothly. See this section for more detail. In your scenario, you can use the mui-replace codemod to update the import paths to v5:

npx @mui/codemod v5.0.0/mui-replace <path>

There are several steps to follow when migration from V4 to V5. The preset-safe codemod will change import statements to use the new mui libraries post-upgrade. This codemod is what you are looking for.

npx @mui/codemod v5.0.0/preset-safe <path>

More details here: https://mui.com/guides/migration-v4/#run-codemods

Related