跳到主要内容

架构

架构概览

这个图表展示了 Docusaurus 如何构建您的应用。每个插件收集其内容并发出 JSON 数据;主题提供布局组件,这些组件接收 JSON 数据作为路由模块。打包器捆绑所有组件并发出服务器端捆绑包和客户端捆绑包。

尽管您(无论是插件作者还是站点创建者)一直在编写 JavaScript,但请记住 JS 实际上在不同的环境中运行:

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

插件代码和主题代码永远不会直接相互导入:它们只通过协议进行通信(在我们的情况下,通过 JSON 临时文件和 addRoute 调用)。一个有用的心智模型是想象插件不是用 JavaScript 编写的,而是用另一种语言如 Rust 编写的。用户与插件交互的唯一方式是通过 docusaurus.config.js,它本身在 Node 中运行(因此您可以使用 require 并将回调作为插件选项传递)。

在打包期间,配置文件本身被序列化和捆绑,允许主题通过 useDocusaurusContext() 访问配置选项,如 themeConfigbaseUrl。然而,siteConfig 对象只包含可序列化的值(经过 JSON.stringify() 后仍然保留的值)。函数、正则表达式等在客户端会丢失。themeConfig 设计为完全可序列化。