如何在Material UI中使用没有ThemeProvider的带有makeStyles的主题对象？

import { createMuiTheme } from '@material-ui/core/styles';

const theme = createMuiTheme({
  palette: {
    primary: {
      main: '#ff0000',
    },
    secondary: {
      main: '#00ff00',
    },
  },
});

import { makeStyles } from '@material-ui/core/styles';

const useStyles = makeStyles((theme) => ({
  root: {
    backgroundColor: theme.palette.primary.main,
    color: theme.palette.secondary.main,
  },
}));

import React from 'react';
import { Box } from '@material-ui/core';

const MyComponent = () => {
  const classes = useStyles();

  return (
    <Box className={classes.root}>
      This is a component with custom styles.
    </Box>
  );
};