Nextjs MDX 在 App Router 中不显示删除线

Question

我正在使用

next14

和

mdx

markdown 文件。每个 Markdown 语法都正确显示，但有删除线。我就这样用了

~~this is my strikethrough~~

。在我的 vscode 中，删除线甚至显示为在文本中间穿过一条线。结果显示我是这样写的

~~this is my strikethrough~~

。 这是我的依赖项。

"dependencies": {
    "@mdx-js/loader": "^3.0.1",
    "@mdx-js/react": "^3.0.1",
    "@next/mdx": "^14.1.1",
    "@types/mdx": "^2.0.11",
    "bootstrap": "^5.3.2",
    "clsx": "^2.1.0",
    "next": "14.1.0",
    "react": "^18",
    "react-bootstrap": "^2.10.1",
    "react-dom": "^18"
  },
  "devDependencies": {
    "@types/node": "^20",
    "@types/react": "^18",
    "@types/react-dom": "^18",
    "eslint": "^8",
    "eslint-config-next": "14.1.0",
    "typescript": "^5"
  }

其他所有标签都很好。它不只显示删除线。他们改变了 Markdown 语法吗？我所能搜索的就是在文本

~~

之前和之后使用这些。 我正在使用

App Router

，我的 mdx 文件目录是

src/app/docs/page.mdx

。我在

mdx-components.tsx

有

src

。我已根据

next.config.js

指南更改了我的

nextjs

文件。

Answer 1

添加 remark-gfm 插件作为依赖项，并配置 next-mdx 以在 next.config.js 文件中使用它。