快速上手

依赖环境

::: tip

  • 使用 pnpm 时，你可能需要安装 vue 和 @vuepress/client 作为 peer-dependencies ，即 pnpm add -D vue @vuepress/client@next 。
  • 使用 yarn 2 时，你需要在 .yarnrc.yml 文件中设置 nodeLinker: 'node-modules' 。 :::

手动安装

这一章节会帮助你从头搭建一个简单的 VuePress 文档网站。如果你想在一个现有项目中使用 VuePress 管理文档，从步骤 3 开始。

  • 步骤1: 创建并进入一个新目录
  1. mkdir vuepress-starter
  2. cd vuepress-starter
  • 步骤2: 初始化项目
bash git init yarn init bash git init npm init
  • 步骤3: 将 VuePress 安装为本地依赖
bash yarn add -D vuepress@next bash npm install -D vuepress@next
  • 步骤4: 在 package.json 中添加一些 scripts
  1. {
  2.   "scripts": {
  3.     "docs:dev": "vuepress dev docs",
  4.     "docs:build": "vuepress build docs"
  5.   }
  6. }
  • 步骤5: 将默认的临时目录和缓存目录添加到 .gitignore 文件中
  1. echo 'node_modules' >> .gitignore
  2. echo '.temp' >> .gitignore
  3. echo '.cache' >> .gitignore
  • 步骤6: 创建你的第一篇文档
  1. mkdir docs
  2. echo '# Hello VuePress' > docs/README.md
  • 步骤7: 在本地启动服务器来开发你的文档网站
bash yarn docs:dev bash npm run docs:dev

VuePress 会在 http://localhost:8080 启动一个热重载的开发服务器。当你修改你的 Markdown 文件时，浏览器中的内容也会自动更新。

现在，你应该已经有了一个简单可用的 VuePress 文档网站。接下来，了解一下 VuePress 配置 相关的内容。