Reference Frontmatter in React MDX Markdown File

Question

我使用mdx: https://mdxjs.com/建立了一个next.js降价博客。

我希望能够在mdx文件本身的前文部分引用数据。像这样:

// my-file.mdx
---
title: "My blog post title"
# {title} // should be replaced by the frontmatter title

现在，这不起作用。它不会将{title}替换为标题中的标题(即。My blog post title)。我想知道的是，是否有办法做到这一点，如果有，怎么做?

谢谢。

Answer 1

查看Docusaurus文档页面中可用的导出。以"title"为"<p>{contentTitle}</p>"为例。对于更具体的键，可以使用如下命令:

<p>{Object.entries(frontMatter).find(frontmatter => frontmatter[0] === 'description'}</p>

来检索(在本例中)描述。(用合适的标签替换html<p>标签)

Answer 2

我使用MDX与Next.js 13，并花了太多的时间寻找一个复杂的解决方案来访问MDX内的frontmatter，如使用remark-mdx-frontmatter为https://mdxjs.com/guides/frontmatter/。但是，如果在Next 13中使用灰质作为前页内容，则默认情况下，前页内容对象将暴露给MDX标记体。所以如果你的MDX有这样的标题:

---
date: 'September 9, 2023'
---

你可以通过以下命令从MDX主体中访问它:

{frontmatter.date}