Docusaurus 静态网站生成

Docusaurus 是 Meta（前 Facebook）开源的一款静态网站生成器，专为编写高质量的文档网站而设计。支持一键生成一个包含文档、博客、版本控制和自定义页面的完整网站骨架。

基本语法

npm init docusaurus@latest [site-name] [template] [flags]

• 建议：始终加上 @latest，确保安装的是 Docusaurus 的最新版本。

常用示例

最常用的标准方式（推荐）

创建一个名为 my-website 的项目，使用官方推荐的 classic 模板：

npm init docusaurus@latest my-website classic

使用 TypeScript

如果偏好 TypeScript，可以加上 --typescript 参数：

npm init docusaurus@latest my-website classic --typescript

Interactive 交互模式

如果你不确定填什么，直接运行以下命令，系统会通过问答形式引导你创建：

npm init docusaurus@latest

参数详解

• [site-name]:
  • 你希望创建的项目文件夹名称（例如 my-docs）。
• [template]:
  • classic (推荐): 包含了标准文档站所需的一切（文档、博客、自定义页面、CSS 框架）。绝大多数用户应该选择这个。
  • facebook: 包含 Meta 公司开源项目特定的配置，普通用户很少用到。
• Flags (选项):
  • --typescript: 将项目代码生成为 TypeScript (.ts/.tsx) 格式。
  • --package-manager: 指定包管理器（如 npm, yarn, pnpm）。如果不指定，通常会根据环境自动推断。

命令执行后会发生什么？

该命令会自动在当前目录下创建一个新文件夹（即 site-name），并生成以下核心目录结构：

my-website/
├── blog/                   # 存放博客 Markdown 文件
├── docs/                   # 存放文档 Markdown 文件
├── src/                    # 存放 React 组件和页面 (如首页)
├── static/                 # 存放静态资源 (图片、robots.txt 等)
├── docusaurus.config.js    # 核心配置文件 (站点名称、导航栏、页脚等)
├── package.json            # 依赖包配置
└── sidebars.js             # 文档侧边栏目录结构配置

后续步骤

项目创建完成后，终端会提示进入目录并启动项目：

1. 进入目录：
   bash

   cd my-website

2. 启动本地开发服务器：
   bash

   npm start
   # 或者如果你用 yarn: yarn start

3. 预览： 打开浏览器访问 http://localhost:3000，你将看到一个运行中的 Docusaurus 网站。