文档:在开始之前
在开始之前请确保依赖环境正常:
TIP
- 使用 pnpmopen in new window 时,需要在
.npmrc
open in new window 文件中设置shamefully-hoist=true
。 - 使用 yarn 2open in new window 时,需要在
.yarnrc.yml
open in new window 文件中设置nodeLinker: 'node-modules'
。
文档:手动安装
这一章节会帮助你从头搭建一个简单的 VuePress 文档网站。 如果你想在一个现有项目中使用 VuePress 管理文档,从步骤 3 开始。
步骤1: 创建并进入一个新目录
mkdir vuepress-starter
cd vuepress-starter
1
2
2
步骤2: 初始化项目
git init
yarn init
1
2
2
git init
npm init
1
2
2
vuepress-theme-oxygen-not-included
主题 安装为本地依赖
步骤3: 将 yarn add vuepress-theme-oxygen-not-included
1
npm install vuepress-theme-oxygen-not-included
1
package.json
中添加一些 scriptsopen in new window
步骤4: 在 {
"scripts": {
"docs:dev": "vuepress dev docs",
"docs:build": "vuepress build docs"
}
}
1
2
3
4
5
6
2
3
4
5
6
.gitignore
文件中
步骤5: 将默认的临时目录和缓存目录添加到 echo 'node_modules' >> .gitignore
echo '.temp' >> .gitignore
echo '.cache' >> .gitignore
1
2
3
2
3
步骤6: 创建第一篇文档
mkdir docs
echo '# Hello VuePress' > docs/README.md
1
2
2
步骤7: 在本地启动服务器来开发你的文档网站
yarn docs:dev
1
npm run docs:dev
1
VuePress 会在 http://localhost:8080open in new window 启动一个热重载的开发服务器。 当修改 Markdown 文件时,浏览器中的内容也会自动更新。
现在,应该已经有了一个简单可用的 VuePress 文档网站。 接下来,了解一下 VuePress 配置open in new window 相关的内容。