我如何使用注释与Astro使我的文章写在markdown保留样式?

Question

我有一个用Astro写的博客，我用markdown写我的文章。当我渲染帖子时，我在使用remark和remark-html来传递我的md标签(如##)时遇到麻烦。

async function remarkContent(content) {
const file = await remark()
.use(remarkHtml)
.process(content);
return content;
}

我已经尝试过这个函数，然后把它传递给一个Html片段，但它不工作

Answer 1

Astro内置对Markdown文件和remark的支持，所以如果你的内容在你的项目文件夹中，你可以将Markdown文件放在你的src/pages/中，并让它们自动转换成页面，或者将你的文件放在其他地方，例如src/content/，并导入它们进行渲染。

如果您的内容是远程存储的，并且您正在获取它，您可能仍然需要做一些类似示例函数的事情。

我认为您的示例代码的主要问题是它返回content。它应该返回转换后的文件:

async function remarkContent(content) {
const file = await remark()
.use(remarkHtml)
.process(content);
return String(file);
}

你可以在Astro注释中使用set:html指令:

<Fragment set:html={remarkContent(mdString)} />