reactjs - 如何在 Docusaurus v2 中嵌入全局 React 组件？

Question

我看到可以使用 MDX 嵌入 React 组件：
https ://v2.docusaurus.io/docs/markdown-features/#embedding-react-components-with-mdx

但是，此方法适用于特定页面。如何使它适用于文档中的所有降价文件？我正在尝试添加与上面链接中类似的组件来更改某些内联文本的样式。我试图编辑 src/pages/index.js 但没有用。

const HighlightGreen = (children) => (
  <span
    style={{
      backgroundColor: '#00a400', // green,
      borderRadius: '2px',
      color: '#fff',
      padding: '0.2rem',
    }}>
    {children}
  </span>
);

Answer 1

yarn swizzle @docusaurus/theme-classic MDXComponents --danger

在src/theme/MDXComponents/index.js：

import {MyComponent} from "/src/components/MyComponent";
...
const MDXComponents = {
    MyComponent,
    ...

Answer 2

现在看来，您可以通过创建website/src/theme/Root.js文件来“调整”根组件，根据：https ://docusaurus.io/docs/using-themes#wrapper-your-site-with-root