markdown - remark-gfm 脚注被忽略

Question

从最新的 remark-gfm 文档中，我可以看到它应该支持脚注。但是，当我键入以下内容时：

Text here. [^1]

Text here. [^2]

[^1]: note 1

[^2]: note 2

这显示为文本，而不是转换为 HTML 标记。

我的代码是：

...
import ReactMarkdown from "react-markdown";                                      
import remarkGfm from "remark-gfm";
...

<ReactMarkdown children={markdown_content_here} remarkPlugins={[remarkGfm]} />
...

Answer 1

我让它在这个代码框中工作。

example.md

Text here. [^1]

Text here. [^2]

[^1]: note 1
[^2]: note 2

import "./styles.css";
import markdown from "./example.md";
import { useEffect, useState } from "react";
import ReactMarkdown from "react-markdown";
import remarkGfm from "remark-gfm";

export default function App() {
  const [text, setText] = useState(null);

  useEffect(() => {
    (async () => {
      const response = await fetch(markdown);
      const content = await response.text();
      setText(content);
    })();
  }, []);
  return <ReactMarkdown remarkPlugins={[remarkGfm]} children={text} />;
}

（另请参见这个带有纯unified+的代码框remark-gfm）。

猜想：为什么它不起作用

有了一个可重现的工作示例，现在可以很容易地观察到与我的实际代码的区别：出于某种原因，我安装了remark-gfmv 2。您应该升级到 v 3以确保脚注有效。