Recientemente actualicé Material V4 a V5 y ahora recibo el siguiente error:
MUI: The `styles` argument provided is invalid. You are providing a function without a theme in the context. One of the parent elements needs to use a ThemeProvider. Dentro de mi archivo App.js , tengo la siguiente configuración:
import { createTheme, ThemeProvider, StyledEngineProvider, adaptV4Theme } from '@mui/material/styles'; import makeStyles from '@mui/styles/makeStyles'; import { CssBaseline, Hidden } from '@mui/material'; let theme = createTheme(adaptV4Theme({ palette: { primary: { light: '#63ccff', main: '#009be5', dark: '#006db3' } }, typography: { h5: { fontWeight: 500, fontSize: 26, letterSpacing: 0.5 } }, shape: { borderRadius: 8 }, props: { MuiTab: { disableRipple: true } }, mixins: { toolbar: { minHeight: 48 } } })); theme = { ...theme, overrides: { MuiDrawer: { paper: { backgroundColor: '#18202c' } } } };y luego tener el siguiente retorno dentro de mi App.js:
const classes = useStyles(); return ( <NotifyProvider> <Routes> <Route path="/login" element={<Login />}></Route> <Route path="/logout" element={<Logout />}></Route> </Routes> <StyledEngineProvider injectFirst> <ThemeProvider theme={theme}> <div className={classes.root}> <CssBaseline /> <nav className={classes.drawer}> </nav> <div className={classes.app}> <Header onDrawerToggle={handleDrawerToggle} /> <main className={classes.main}> <Routes> <Route path="/" /> </Routes> </main> </div> </div> </ThemeProvider> </StyledEngineProvider> </NotifyProvider> ); No estoy seguro de cuál es el problema y qué me falta, pero también noté que adaptV4Theme está obsoleto.
Cualquier ayuda sería genial ya que la aplicación no se inicia en absoluto.
Tengo el mismo problema. hay un hilo aquí: https://github.com/mui/material-ui/issues/30092 con algunas sugerencias para solucionar problemas. ninguno de ellos funcionó para mí, pero algunos otros en el hilo parecen haber resuelto el problema eliminando yarn.lock y volviendo a ejecutar yarn install , consulte el hilo para obtener más detalles. si lo resuelve, publique aquí y hágame saber qué lo arregló, he estado trabajando en esto durante varios días sin suerte.
ETA: pude resolver esto en mi aplicación envolviendo los componentes que estaba probando en un <ThemeProvider/> , como se sugiere aquí: https://github.com/mui/material-ui/issues/15528#issuecomment- 487952731 (solo recibí el mensaje de error durante la prueba)