跳到主要内容

架构

架构概览

此图展示了道格龙(Docusaurus)如何构建你的应用。各个插件收集它们的内容并发出 JSON 数据;主题提供布局组件,这些组件接收 JSON 数据作为路由模块。打包工具将所有组件打包,并发出一个服务器端包和一个客户端包。

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

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

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

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