使用 MDXRemote 时，_jsxDev 不是函数

Question

我正在使用 Next.js 和 mdx 创建一个博客。

我开始遵循整个教程。他使用 nextjs 和 md 制作了博客。

然后，我按照本教程中的一部分从使用 md 切换到 mdx

然而，由于某种原因，下面的一行代码导致了图中的错误

 <MDXRemote {...props.mdxSource} components={components} />

整个代码

import fs from 'fs'
import matter from 'gray-matter'
import { serialize } from 'next-mdx-remote/serialize'
import { MDXRemote } from 'next-mdx-remote'

import path from 'path'

export default function Post(props) {
    const components = {}

    return (
        <>
            // this line of code is causing error
            <MDXRemote {...props.mdxSource} components={components} />

        </>
    )
}

export async function getStaticProps(context) {    
    const markdownWithMeta = fs.readFileSync(
        path.join('posts', slug + '.mdx'),
        'utf-8'
    )
    const { content } = matter(markdownWithMeta)
    const mdxSource = await serialize(content)

    return {
        props: {            
            mdxSource,            
        },
    }
}

我正在使用的包： https: //github.com/hashicorp/next-mdx-remote

Answer 1

您可以按照 github issues 中的建议使用 {development: false }，而不是降级。

  const mdxSource = await serialize(source, {
    mdxOptions: { development: false },
  });

https://github.com/hashicorp/next-mdx-remote/issues/324

Answer 2

同样的问题。降级至“^3.0.8”