第一个项目

创建一个空的 Docusaurus 项目，然后在 项目/docs 目录下更新 .md/.mdx 文章，使用 npm start 在更新文章的时候实时预览网站效果。完成文章编辑后，使用 npm run build 生成网站的源文件，将源文件部署到服务器。若是没有服务器，可使用 npm run serve 将网站发布到本地，局域网类用户可通过 主机ip:端口 浏览网站。

一、创建第一个 Docusaurus 项目

你可以在 Windows Powershell、Linux 终端或 在线代码沙盒 中执行以下命令。

第一步，进入一个文件夹，然后执行创建命令

npx create-docusaurus@latest my-website classic

my-website 是项目名称，将自动创建这个目录。classic 表明使用预设模板初始化这个项目。

第三步，进入项目目录，启动预览

cd my-website
npm run start

项目结构和预览效果：

二、项目结构

my-website
├── blog
│   ├── 2019-05-28-hola.md
│   ├── 2019-05-29-hello-world.md
│   └── 2020-05-30-welcome.md
├── docs
│   ├── doc1.md
│   ├── doc2.md
│   ├── doc3.md
│   └── mdx.md
├── src
│   ├── css
│   │   └── custom.css
│   └── pages
│       ├── styles.module.css
│       └── index.js
├── static
│   └── img
├── docusaurus.config.js
├── package.json
├── README.md
├── sidebars.js
└── yarn.lock

docusaurus 从 blog 、docs、 src/pages 三个位置获取内容生成文章，分别对博客、文档、独立页面格式进行了优化。 只要在这些目录下编写 .md、.mdx、.js 文档，就会被 docusaurus 自动生成文章页面。

static 存放静态资源，在文章中引用图片、视频、其他资源。

docusaurus.config.js 用于配置网站的标题、导航栏等。

package.json 可以自定义 npm 命令。

sidebars.js 控制侧边栏目录的生成。

README.md 和 yarn.lock 可以忽略。

三、升级 docusaurus 版本

npm run start 时会检测 docusaurus 更新：

执行提示中的命令即可完成更新。