Docusaurus MDX渲染

Question

我正在和Facebook的Docusaurus的一些DOCS合作。

我正在尝试重新呈现一些MDX文档，如下所示：

---
id: colors
title: Colors
---

## Library

<pre style={{ background: "black" }}>zzz</pre>

Docusaurus将MD文件视为简单的标记，试图呈现一个带有样式错误的超文本标记语言<pre>zzz</pre>。不尝试呈现JSX。

我还尝试将文件从test.md重命名为test.mdx，但Docusaurus似乎再也找不到该文件了。

我是不是遗漏了什么设置？这就像我根本没有MDX渲染。

我的Package.json

{
  "scripts": {
    "examples": "docusaurus-examples",
    "start": "docusaurus-start",
    "build": "docusaurus-build",
    "publish-gh-pages": "docusaurus-publish",
    "write-translations": "docusaurus-write-translations",
    "version": "docusaurus-version",
    "rename-version": "docusaurus-rename-version"
  },
  "devDependencies": {
    "docusaurus": "^1.14.4"
  },
  "dependencies": {
    "@docusaurus/mdx-loader": "^2.0.0-alpha.37",
    "@docusaurus/plugin-content-docs": "^2.0.0-alpha.37",
  }
}

非常感谢。

Answer 1

这应该只适用于Docusaurus，不需要任何额外的包，添加文本颜色属性即可查看文本，如下所示：

<pre style={{ background: "black", color: "white" }}>zzz</pre>