开始使用 VuePress
启动开发服务器
你可以在 代码登录后可见 中添加一些 [链接登录后可见] :
代码登录后可见
运行 代码登录后可见 脚本可以启动开发服务器:
代码登录后可见
VuePress 会在 [链接登录后可见] 启动一个热重载的开发服务器。当你修改你的 Markdown 文件时,浏览器中的内容也会自动更新。
构建你的网站
运行 代码登录后可见 脚本可以构建你的网站:
代码登录后可见
在 代码登录后可见 目录中可以找到构建生成的静态文件。
反向代理
参考教程:[链接登录后可见]
⚠️Nginx Proxy Manager(以下简称NPM)会用到80、443端口,所以本机不能占用(比如原来就有Nginx)
互联网使用请确保完成了域名解析
配置
配置文件
VuePress 站点的基本配置文件是 代码登录后可见 ,但也同样支持 TypeScript 配置文件。你可以使用 代码登录后可见 来得到更好的类型提示。
具体而言,我们对于配置文件的路径有着约定(按照优先顺序):
你也可以通过 命令行接口 的 代码登录后可见 选项来指定配置文件:
代码登录后可见
一个基础的配置文件是这样的:
代码登录后可见
客户端配置文件
在大多数情况下,配置文件已经足够帮助你配置好你的 VuePress 站点。不过,有些时候用户们可能希望直接添加一些客户端代码。 VuePress 通过客户端配置文件来支持这种需求:
代码登录后可见
同样的,我们也有关于客户端配置文件的路径约定(按照优先顺序):
一个基础的客户端配置文件是这样的:
代码登录后可见
页面
VuePress 是以 Markdown 为中心的。你项目中的每一个 Markdown 文件都是一个单独的页面。
路由
默认情况下,页面的路由路径是根据你的 Markdown 文件的相对路径决定的。
假设这是你的 Markdown 文件所处的目录结构:
代码登录后可见
将 代码登录后可见 目录作为你的 sourceDir ,例如你在运行 代码登录后可见 命令。此时,你的 Markdown 文件对应的路由路径为:
提示
默认配置下, 代码登录后可见 和 代码登录后可见 都会被转换成 代码登录后可见 ,并且其对应的路由路径都是由斜杠结尾的。然而,如果你想同时保留这两个文件,就可能会造成冲突。
在这种情况下,你可以设置 pagePatterns 来避免某个文件被 VuePress 处理,例如使用 代码登录后可见 来排除所有的 代码登录后可见 文件。
此外,一些符号如 代码登录后可见 和 代码登录后可见 可能对 vue-router 有特殊含义,因此你应该避免使用它们
Frontmatter
Markdown 文件可以包含一个 [链接登录后可见] Frontmatter 。Frontmatter 必须在 Markdown 文件的顶部,并且被包裹在一对三短划线中间。下面是一个基本的示例:
代码登录后可见
你肯定注意到 Frontmatter 中的字段和配置文件中的站点配置十分类似。你可以通过 Frontmatter 来覆盖当前页面的 代码登录后可见, 代码登录后可见, 代码登录后可见 等属性。因此,你可以把 Frontmatter 当作页面级作用域的配置。
同样的,VuePress 有一些内置支持的 Frontmatter 字段,而你使用的主题也可能有它自己的特殊 Frontmatter 。
内容
页面的主要内容是使用 Markdown 书写的。VuePress 首先会将 Markdown 转换为 HTML ,然后将 HTML 作为 Vue 单文件组件的 代码登录后可见 。
借助 [链接登录后可见] 和 Vue 模板语法的能力,基础的 Markdown 可以得到很多的扩展功能。
Markdown
在阅读本章节之前,请确保你已经对 Markdown 有所了解。如果你还不了解 Markdown ,请先学习一些 [链接登录后可见]。
VuePress 会使用 [链接登录后可见] 来解析 Markdown 内容,因此可以借助于 markdown-it 插件来实现 [链接登录后可见] 。
本章节将会介绍 VuePress 内置支持的 Markdown 语法扩展。
你也可以通过 markdown 和 extendsMarkdown 来配置这些内置扩展、加载更多 markdown-it 插件、实现你自己的扩展等。
内置
由 markdown-it 内置支持:
标题锚点
你可能已经注意到,当你把鼠标放在各个章节的标题上时,会显示出一个 代码登录后可见 锚点。点击这个 代码登录后可见 锚点,可以直接跳转到对应章节。
标题锚点扩展由 [链接登录后可见]支持。
链接
在你使用 Markdown 的 [链接登录后可见] 时, VuePress 会为你进行一些转换。
主题
VuePress 主题为你提供了布局、样式和其他功能,帮助你专注于 Markdown 内容的写作。
默认主题
VuePress 提供了一个默认主题,你当前正在浏览的文档网站就是使用的这个默认主题。
你需要在你的配置文件中通过 theme 配置项来使用它:
代码登录后可见
然而,你可能觉得默认主题不够出色,又或者你不想搭建一个文档网站,而是一个其他类型的网站,比如博客。此时,你可以尝试使用社区主题或者创建本地主题。
社区主题
社区用户创建了很多主题,并将它们发布到了 [链接登录后可见] 上。查看主题本身的文档可以获取更详细的指引。
你可以在 [链接登录后可见] 中探索更多主题。
插件
官方插件
VuePress 团队提供了一些官方插件。
你需要在你的配置文件中通过 plugins 配置项来使用它们。举例来说,你可以使用 [链接登录后可见]来使用 Google Analytics :
代码登录后可见
大部分插件只能使用一次,如果同一个插件被多次使用,那么只有最后一次会生效。
然而,部分插件是可以被多次使用的(例如 [链接登录后可见]),你应该查看插件本身的文档来获取详细指引。
社区插件
社区用户创建了很多插件,并将它们发布到了 [链接登录后可见] 上。 查看插件本身的文档可以获取更详细的指引。
你可以在 [链接登录后可见] 中探索更多插件。