I'm totally new to React and I'm trying to use makeStyles. I'm using it as they use it in the docs, but It's not working for me and my page just went to blank white page after using it.

    import {makeStyles} from "@mui/material";
    
    const useStyles = makeStyles({
      field: {
        marginTop: 20,
        marginBottom: 20,
        display: "block",
      },
    });
    
export default function Create() {
  const classes = useStyles();
       return (   <TextField
            className={classes.field}
            label="Note Title"
            variant="outlined"
            color="secondary"
            fullWidth
            required
          /> );
}

am I doing anything wrong?

CodePudding user response：

Did you install all you dependencies? See a copy of your version here.

import { makeStyles } from "@mui/styles";
import TextField from "@mui/material/TextField";

const useStyles = makeStyles({
  field: {
    marginTop: 20,
    marginBottom: 20,
    display: "block"
  }
});

export default function App() {
  const classes = useStyles();
  return (
    <TextField
      className={classes.field}
      label="Note Title"
      variant="outlined"
      color="secondary"
      fullWidth
      required
    />
  );
}