带有样式组件的材料UI -Freededas从未工作

Question

我正在使用react，材料ui 样式组件。
您能帮我调整一下吗？ 转发不起作用。

coursassage.style.js

import styled from 'styled-components';
import { Button as ButtonComponent } from '../../components/Button/Button';

export const Button = styled(ButtonComponent)`
  text-decoration: none;
`;

coursasspage.jsx

import { Link } from 'react-router-dom';
import { Button } from './CoursesPage.style';

<Button
    to='/courses/add'
    variant='outlined'
    size='small'
    forwardedAs={Link}
>
    Add new course
</Button>

button.jsx

import { StyledButton } from './Button.style';

export const Button = (props) => (
    <StyledButton {...props}>{props.children}</StyledButton>
);

button.style.jsx

import { styled } from '@mui/material/styles';
import MUIButton from '@mui/material/Button';

export const StyledButton = styled(MUIButton)`
    color: #000;
    border: 1px solid #474747;
    text-transform: initial;

    &:hover {
        background-color: #d0d0d0;
        border: 1px solid #474747;
    }
`;