Ошибка при использовании Partial <NormalComponents & SpecialComponents> в nextjs с TypeScript

Question

Я пытаюсь разработать приложение для блога, используя Next.js. В этом приложении есть компонент, который принимает файл разметки и отображает его содержимое как страницу блога.

      import ReactMarkdown from 'react-markdown';
import { NormalComponents, SpecialComponents } from 'react-markdown/lib/ast-to-react';
import { materialLight } from 'react-syntax-highlighter/dist/cjs/styles/prism';
import {Prism as SyntaxHighlighter} from 'react-syntax-highlighter';
import { FunctionComponent } from 'react';

interface IProps {
    content: string;
}

const Markdown: FunctionComponent<IProps> = ({content}) => {
    const components: Partial<NormalComponents & SpecialComponents> = {
        code({node, inline, className, children, ...props}) {
            const match = /language-(\w+)/.exec(className || '');
    
            return (!inline && match) ? (
                <SyntaxHighlighter style={materialLight} PreTag="div" language={match[1]} children={String(children).replace(/\n$/, '')} {...props} />
            ) : (
                <code className={className ? className : ""} {...props}>
                    {children}
                </code>
            )
        }
    }

    return <div className="markdown-body">
        <ReactMarkdown components={components} children={content} />
    </div>
}

export default Markdown;

Однако когда я попытался создать приложение, он потерпел неудачу, вызвав следующую ошибку.

Тип '({node, inline, className,children, ... props}: {[x: string]: any; node: any; inline: any;className: any; children: any;}) => Element' - это не назначается типу '(("code" | ((props:ClassAttributes & HTMLAttributes &ReactMarkdownProps) => ReactNode)) & (keyof IntrinsicElements |CodeComponent)) | неопределенный'. Тип '({node, inline, className,children, ... props}: {[x: string]: any; node: any; inline: any;className: any; children: any;}) => Element' - это не назначается типу "код" и CodeComponent. Тип '({node, inline, className,children, ... props}: {[x: string]: any; node: any; inline: any;className: any; children: any;}) => Element' - это не присваивается типу «код».

Поскольку я новичок в Next.js, я действительно не мог понять, почему это происходит. Много искал в Интернете, но не нашел удовлетворительного ответа. Единственное, что я мог понять, это то, что речь идет о некоторых недостающих типах, но дальше этого не было.

Как я могу избежать этой проблемы и создать приложение Next.js? вся помощь приветствуется.