分配useStyles const中断

Question

我正在尝试使用useStyles覆盖MUI图标的默认设置。我仍然很新，是JS和MUI，我认为以下代码可以让我为图标设置自定义大小：

const useStyles = makeStyles((theme: AppTheme) =>
createStyles({
        svgSize: {
            width: 24,
            height: 24
        },
    },
));


const renderIcon = (type: ActivityType) => {
const classes = useStyles();
if (
    type === 'document_updated' ||
    type === 'study_team_updated' ||
    type === 'update_site_info' ||
    type === 'update_study_type'
)
{
    return (
        <UpdateIcon htmlColor={appTheme.colors.slate} className={classes.svgSize} />
    );
}
if (type === 'document_uploaded' || type === 'add_study') {
    return (
        <PostAddIcon htmlColor={appTheme.colors.slate} className={classes.svgSize}/>
    );
}
return <FileCopyIcon htmlColor={appTheme.colors.slate} className={classes.svgSize} />;
};

但是，一旦我添加const classes = useStyles(); ，浏览器预览就会中断。编译时没有错误。

有帮助吗？