facebook/docusaurus
6 articles
前置知识
- ›React 基础知识（组件、Hooks、Context）
- ›熟悉 Node.js 以及 npm/yarn workspaces
- ›对静态站点生成器有基本了解
01
Docusaurus 架构：Monorepo 全局导览
从宏观视角解析 Docusaurus monorepo 的整体设计，涵盖其 40 个包的组织结构、服务端与客户端的职责划分、CLI 调度机制、loadSite() 流水线、代码生成逻辑以及客户端路由体系。
02
插件生命周期：内容如何变成路由
深入剖析 4 阶段插件生命周期——初始化、内容加载、通过 actions 系统创建路由、跨插件通信、预设、合成插件，以及渐进式类型层级体系。
03
从源码到静态文件：构建管道与打包器抽象
完整追踪从 CLI 调用到静态 HTML 输出的构建流程——多语言构建、Webpack/Rspack 抽象层、SSG 执行模式，以及 future.faster 性能标志系统。
04
内容插件与 MDX 管道：从 Markdown 到 React
深入探讨 Docusaurus 如何将 Markdown 和 MDX 文件转换为 React 组件——包括 MDX webpack loader、remark/rehype 插件链、docs 插件的版本管理与侧边栏系统，以及路由创建机制。
05
主题系统：别名、Swizzling 与组件定制
深入剖析 Docusaurus 主题系统在 Webpack 别名层面的工作原理——分层别名解析、@docusaurus/* 客户端 API、theme-classic 与 theme-common、swizzle CLI 以及降级组件。
06
开发者体验：Dev Server、i18n 与配置系统
深入讲解 dev server 的热重载架构、i18n 系统将每个语言环境构建为独立站点的设计思路、支持 TypeScript 的配置加载机制、future flag 系统，以及贯穿全文的完整数据流追踪。