将 MDX 与 NextJS 13 一起使用返回 useContext 错误

Question

我正在尝试在 Next.js 13 中使用 mdx 文件。我已经在 next.config 中完成了所有必要的配置并创建了文件。 在 app 文件夹内，我有 > docs > components > accordion > page.mdx

页面文件只渲染一个标题，如“#Title”。当我导航到此 URL 时，出现以下错误：

node_modules/@mdx-js/react/lib/index.js (34:26) @React 错误 - createContext 仅适用于客户端组件。在文件顶部添加“使用客户端”指令以使用它。阅读更多：https://nextjs.org/docs/messages/context-in-server-component

我怎么解决这个问题？

我的 next.config.js

const withMDX = require('@next/mdx')({
  extension: /\.mdx?$/,
  options: {
    remarkPlugins: [],
    rehypePlugins: [],
  },
})

/** @type {import('next').NextConfig} */
const nextConfig = {
  pageExtensions: ['ts', 'tsx', 'js', 'jsx', 'md', 'mdx'],
  experimental: {
    appDir: true,
  },
}

module.exports = withMDX(nextConfig)