架构

此图显示了 Docusaurus 如何构建你的应用程序。每个插件收集其内容并发出 JSON 数据；主题提供布局组件，这些组件以路由模块的形式接收 JSON 数据。打包器将所有组件打包，并发出一个服务器包和一个客户端包。

尽管你（无论是插件作者还是网站创建者）一直在编写 JavaScript，但请记住，JS 实际上是在不同的环境中运行的。

• 所有插件生命周期方法都在 Node 中运行。因此，在我们支持代码库中的 ES Modules 之前，插件源代码必须以可导入的 ES 模块形式提供，或以可 `require` 的 CommonJS 形式提供。
• 主题代码是使用 Webpack 构建的。它们可以按照 React 约定以 ESM 形式提供。

插件代码和主题代码之间从不直接相互导入：它们仅通过协议（在我们的例子中，通过 JSON 临时文件和对 `addRoute` 的调用）进行通信。一个有用的思维模型是，想象插件不是用 JavaScript 编写的，而是用另一种语言（如 Rust）编写的。用户与插件交互的唯一方式是通过 `docusaurus.config.js`，该文件本身在 Node 中运行（因此你可以使用 `require` 并将回调作为插件选项传递）。

在打包过程中，配置文件本身会被序列化并打包，从而允许主题通过 useDocusaurusContext() 访问配置选项，如 `themeConfig` 或 `baseUrl`。然而，`siteConfig` 对象只包含 可序列化的值（在 `JSON.stringify()` 后保留的值）。函数、正则表达式等将在客户端丢失。`themeConfig` 被设计为完全可序列化的。