docs: vuepress构建文档

This commit is contained in:
远野千束 2024-03-28 12:05:03 +08:00
parent 7cecfd1053
commit 37b1346361
20 changed files with 295 additions and 917 deletions

View File

@ -2,6 +2,14 @@ import { navbar } from "vuepress-theme-hope";
export default navbar([
"/",
"/deployment/",
"/usage/",
{
text: "项目部署",
link: "/deployment/",
prefix: "deployment/",
},
{
text: "使用手册",
link: "/usage/",
prefix: "usage/",
}
]);

View File

@ -7,14 +7,12 @@ export default sidebar({
text: "项目部署",
icon: "laptop-code",
prefix: "deployment/",
link: "deployment/",
children: "structure",
},
{
text: "使用手册",
icon: "laptop-code",
icon: "book",
prefix: "usage/",
link: "usage/",
children: "structure",
},
],

View File

@ -6,7 +6,7 @@ export default hopeTheme({
hostname: "https://vuepress-theme-hope-docs-demo.netlify.app",
author: {
name: "SnowyKami",
name: "远野千束",
url: "https://snowykami.me",
},
@ -25,7 +25,7 @@ export default hopeTheme({
sidebar,
// 页脚
footer: "LiteyukiBot",
footer: "默认页脚",
displayFooter: true,
// 加密配置

View File

@ -1,187 +0,0 @@
import { hopeTheme } from "vuepress-theme-hope";
import navbar from "./navbar.js";
import sidebar from "./sidebar.js";
export default hopeTheme({
hostname: "https://vuepress-theme-hope-docs-demo.netlify.app",
author: {
name: "Mr.Hope",
url: "https://mister-hope.com",
},
iconAssets: "fontawesome-with-brands",
logo: "https://theme-hope-assets.vuejs.press/logo.svg",
repo: "vuepress-theme-hope/vuepress-theme-hope",
docsDir: "src",
// 导航栏
navbar,
// 侧边栏
sidebar,
// 页脚
footer: "默认页脚",
displayFooter: true,
// 加密配置
encrypt: {
config: {
"/demo/encrypt.html": ["1234"],
},
},
// 多语言配置
metaLocales: {
editLink: "在 GitHub 上编辑此页",
},
// 如果想要实时查看任何改变,启用它。注: 这对更新性能有很大负面影响
// hotReload: true,
// 在这里配置主题提供的插件
plugins: {
// 你应该自行生成自己的评论服务
comment: {
provider: "Giscus",
repo: "vuepress-theme-hope/giscus-discussions",
repoId: "R_kgDOG_Pt2A",
category: "Announcements",
categoryId: "DIC_kwDOG_Pt2M4COD69",
},
components: {
components: ["Badge", "VPCard"],
},
// 此处开启了很多功能用于演示,你应仅保留用到的功能。
mdEnhance: {
align: true,
attrs: true,
codetabs: true,
component: true,
demo: true,
figure: true,
imgLazyload: true,
imgSize: true,
include: true,
mark: true,
stylize: [
{
matcher: "Recommended",
replacer: ({ tag }) => {
if (tag === "em")
return {
tag: "Badge",
attrs: { type: "tip" },
content: "Recommended",
};
},
},
],
sub: true,
sup: true,
tabs: true,
vPre: true,
// 在启用之前安装 chart.js
// chart: true,
// insert component easily
// 在启用之前安装 echarts
// echarts: true,
// 在启用之前安装 flowchart.ts
// flowchart: true,
// gfm requires mathjax-full to provide tex support
// gfm: true,
// 在启用之前安装 katex
// katex: true,
// 在启用之前安装 mathjax-full
// mathjax: true,
// 在启用之前安装 mermaid
// mermaid: true,
// playground: {
// presets: ["ts", "vue"],
// },
// 在启用之前安装 reveal.js
// revealJs: {
// plugins: ["highlight", "math", "search", "notes", "zoom"],
// },
// 在启用之前安装 @vue/repl
// vuePlayground: true,
// install sandpack-vue3 before enabling it
// sandpack: true,
},
// 如果你需要 PWA。安装 @vuepress/plugin-pwa 并取消下方注释
// pwa: {
// favicon: "/favicon.ico",
// cacheHTML: true,
// cachePic: true,
// appendBase: true,
// apple: {
// icon: "/assets/icon/apple-icon-152.png",
// statusBarColor: "black",
// },
// msTile: {
// image: "/assets/icon/ms-icon-144.png",
// color: "#ffffff",
// },
// manifest: {
// icons: [
// {
// src: "/assets/icon/chrome-mask-512.png",
// sizes: "512x512",
// purpose: "maskable",
// type: "image/png",
// },
// {
// src: "/assets/icon/chrome-mask-192.png",
// sizes: "192x192",
// purpose: "maskable",
// type: "image/png",
// },
// {
// src: "/assets/icon/chrome-512.png",
// sizes: "512x512",
// type: "image/png",
// },
// {
// src: "/assets/icon/chrome-192.png",
// sizes: "192x192",
// type: "image/png",
// },
// ],
// shortcuts: [
// {
// name: "Demo",
// short_name: "Demo",
// url: "/demo/",
// icons: [
// {
// src: "/assets/icon/guide-maskable.png",
// sizes: "192x192",
// purpose: "maskable",
// type: "image/png",
// },
// ],
// },
// ],
// },
// },
},
});

View File

@ -1,9 +0,0 @@
---
title: 主要功能与配置演示
index: false
icon: laptop-code
category:
- 使用指南
---
<Catalog>a</Catalog>

View File

@ -1,42 +0,0 @@
---
title: 布局与功能禁用
icon: gears
order: 4
category:
- 使用指南
tag:
- 禁用
navbar: false
sidebar: false
breadcrumb: false
pageInfo: false
contributors: false
editLink: false
lastUpdated: false
prev: false
next: false
comment: false
footer: false
backtotop: false
---
你可以通过设置页面的 Frontmatter在页面禁用功能与布局。
<!-- more -->
本页面就是一个示例,禁用了如下功能:
- 导航栏
- 侧边栏
- 路径导航
- 页面信息
- 贡献者
- 编辑此页链接
- 更新时间
- 上一篇/下一篇 链接
- 评论
- 页脚
- 返回顶部按钮

View File

@ -1,15 +0,0 @@
---
icon: lock
category:
- 使用指南
tag:
- 加密
---
# 密码加密的文章
实际的文章内容。
段落 1 文字段落 1 文字段落 1 文字段落 1 文字段落 1 文字段落 1 文字段落 1 文字段落 1 文字段落 1 文字段落 1 文字段落 1 文字段落 1 文字。
段落 2 文字段落 2 文字段落 2 文字段落 2 文字段落 2 文字段落 2 文字段落 2 文字段落 2 文字段落 2 文字段落 2 文字段落 2 文字段落 2 文字段落 2 文字段落 2 文字。

View File

@ -1,30 +0,0 @@
---
title: 布局
icon: object-group
order: 3
category: 使用指南
tag:
- 布局
---
布局包括:
- [导航栏](https://theme-hope.vuejs.press/zh/guide/layout/navbar.html)
- [侧边栏](https://theme-hope.vuejs.press/zh/guide/layout/sidebar.html)
- [页脚](https://theme-hope.vuejs.press/zh/guide/layout/footer.html)
同时每个页面包含:
- [路径导航](https://theme-hope.vuejs.press/zh/guide/layout/breadcrumb.html)
- [标题和页面信息](https://theme-hope.vuejs.press/zh/guide/feature/page-info.html)
- [TOC (文章标题列表)](https://theme-hope.vuejs.press/zh/guide/layout/page.html#标题列表)
- [贡献者、更新时间等页面元信息](https://theme-hope.vuejs.press/guide/feature/meta.html)
- [评论](https://theme-hope.vuejs.press/zh/guide/feature/comment.html)
主题也带有以下元素:
- [夜间模式按钮](https://theme-hope.vuejs.press/zh/guide/interface/darkmode.html)
- [返回顶部按钮](https://theme-hope.vuejs.press/guide/interface/others.html#返回顶部按钮)
- [打印按钮](https://theme-hope.vuejs.press/guide/interface/others.html#打印按钮)
你可以在主题选项和页面的 frontmatter 中自定义它们。

View File

@ -1,269 +0,0 @@
---
title: Markdown 展示
icon: fab fa-markdown
order: 2
category:
- 使用指南
tag:
- Markdown
---
VuePress 主要从 Markdown 文件生成页面。因此,你可以使用它轻松生成文档或博客站点。
你应该创建和编写 Markdown 文件,以便 VuePress 可以根据文件结构将它们转换为不同的页面。
<!-- more -->
## Markdown 介绍
如果你是一个新手,还不会编写 Markdown请先阅读 [Markdown 介绍](https://theme-hope.vuejs.press/zh/cookbook/markdown/) 和 [Markdown 演示](https://theme-hope.vuejs.press/zh/cookbook/markdown/demo.html)。
## Markdown 配置
VuePress 通过 Frontmatter 为每个 Markdown 页面引入配置。
::: info
Frontmatter 是 VuePress 中很重要的一个概念,如果你不了解它,你需要阅读 [Frontmatter 介绍](https://theme-hope.vuejs.press/zh/cookbook/vuepress/page.html#front-matter)。
:::
## Markdown 扩展
VuePress 会使用 [markdown-it](https://github.com/markdown-it/markdown-it) 来解析 Markdown 内容,因此可以借助于 markdown-it 插件来实现 [语法扩展](https://github.com/markdown-it/markdown-it#syntax-extensions) 。
### VuePress 扩展
为了丰富文档写作VuePress 对 Markdown 语法进行了扩展。
关于这些扩展,请阅读 [VuePress 中的 Markdown 扩展](https://theme-hope.vuejs.press/zh/cookbook/vuepress/markdown.html)。
### 主题扩展
通过 [`vuepress-plugin-md-enhance`][md-enhance],主题扩展了更多 Markdown 语法,提供更加丰富的写作功能。
#### 提示容器
::: v-pre
安全的在 Markdown 中使用 {{ variable }}。
:::
::: info 自定义标题
信息容器,包含 `代码` 与 [链接](#提示容器)。
```js
const a = 1;
```
:::
::: tip 自定义标题
提示容器
:::
::: warning 自定义标题
警告容器
:::
::: caution 自定义标题
危险容器
:::
::: details 自定义标题
详情容器
:::
- [查看详情](https://theme-hope.vuejs.press/zh/guide/markdown/hint.html)
#### 代码块
::: code-tabs
@tab pnpm
```bash
pnpm add -D vuepress-theme-hope
```
@tab yarn
```bash
yarn add -D vuepress-theme-hope
```
@tab:active npm
```bash
npm i -D vuepress-theme-hope
```
:::
- [查看详情](https://theme-hope.vuejs.press/zh/guide/markdown/code-tabs.html)
#### 上下角标
19^th^ H~2~O
- [查看详情](https://theme-hope.vuejs.press/zh/guide/markdown/sup-sub.html)
#### 自定义对齐
::: center
我是居中的
:::
::: right
我在右对齐
:::
- [查看详情](https://theme-hope.vuejs.press/zh/guide/markdown/align.html)
#### Attrs
一个拥有 ID 的 **单词**{#word}。
- [查看详情](https://theme-hope.vuejs.press/zh/guide/markdown/attrs.html)
#### 脚注
此文字有脚注[^first].
[^first]: 这是脚注内容
- [查看详情](https://theme-hope.vuejs.press/zh/guide/markdown/footnote.html)
#### 标记
你可以标记 ==重要的内容== 。
- [查看详情](https://theme-hope.vuejs.press/zh/guide/markdown/mark.html)
#### 任务列表
- [x] 计划 1
- [ ] 计划 2
- [查看详情](https://theme-hope.vuejs.press/zh/guide/markdown/tasklist.html)
### 图片增强
支持为图片设置颜色模式和大小
- [查看详情](https://theme-hope.vuejs.press/zh/guide/markdown/image.html)
#### 组件
```component VPCard
title: Mr.Hope
desc: Where there is light, there is hope
logo: https://mister-hope.com/logo.svg
link: https://mister-hope.com
background: rgba(253, 230, 138, 0.15)
```
- [查看详情](https://theme-hope.vuejs.press/zh/guide/markdown/component.html)
#### 导入文件
<!-- @include: ./README.md{11-17} -->
- [查看详情](https://theme-hope.vuejs.press/zh/guide/markdown/include.html)
#### 样式化
向 Mr.Hope 捐赠一杯咖啡。 _Recommended_
- [查看详情](https://theme-hope.vuejs.press/zh/guide/markdown/stylize.html)
#### Tex 语法
$$
\frac {\partial^r} {\partial \omega^r} \left(\frac {y^{\omega}} {\omega}\right)
= \left(\frac {y^{\omega}} {\omega}\right) \left\{(\log y)^r + \sum_{i=1}^r \frac {(-1)^i r \cdots (r-i+1) (\log y)^{r-i}} {\omega^i} \right\}
$$
- [查看详情](https://theme-hope.vuejs.press/zh/guide/markdown/tex.html)
#### 图表
<iframe src="https://plugin-md-enhance-demo.vuejs.press/snippet/chartjs.html" width="100%" height="450"/>
- [查看详情](https://theme-hope.vuejs.press/zh/guide/markdown/chartjs.html)
#### Echarts
<iframe src="https://plugin-md-enhance-demo.vuejs.press/snippet/echarts.html" width="100%" height="800"/>
- [查看详情](https://theme-hope.vuejs.press/zh/guide/markdown/echarts.html)
#### 流程图
<iframe src="https://plugin-md-enhance-demo.vuejs.press/snippet/flowchart.html" width="100%" height="450"/>
- [查看详情](https://theme-hope.vuejs.press/zh/guide/markdown/flowchart.html)
#### MarkMap
<iframe src="https://plugin-md-enhance-demo.vuejs.press/snippet/markmap.html" width="100%" height="380"/>
- [查看详情](https://theme-hope.vuejs.press/zh/guide/markdown/markmap.html)
#### Mermaid
<iframe src="https://plugin-md-enhance-demo.vuejs.press/snippet/mermaid.html" width="100%" height="620"/>
- [查看详情](https://theme-hope.vuejs.press/zh/guide/markdown/mermaid.html)
#### 代码演示
<iframe src="https://plugin-md-enhance-demo.vuejs.press/snippet/code-demo.html" width="100%" height="450"/>
- [查看详情](https://theme-hope.vuejs.press/zh/guide/markdown/demo.html)
#### 交互演示
<iframe src="https://plugin-md-enhance-demo.vuejs.press/snippet/playground.html" width="100%" height="480"/>
- [查看详情](https://theme-hope.vuejs.press/zh/guide/markdown/playground.html)
#### Kotlin 交互演示
<iframe src="https://plugin-md-enhance-demo.vuejs.press/snippet/kotlin-playground.html" width="100%" height="220"/>
- [View Detail](https://theme-hope.vuejs.press/zh/guide/markdown/kotlin-playground.html)
#### Vue 交互演示
<iframe src="https://plugin-md-enhance-demo.vuejs.press/snippet/vue-playground.html" width="100%" height="380"/>
- [查看详情](https://theme-hope.vuejs.press/zh/guide/markdown/vue-playground.html)
#### Sandpack 交互演示
<iframe src="https://plugin-md-enhance-demo.vuejs.press/snippet/sandpack.html" width="100%" height="380"/>
- [查看详情](https://theme-hope.vuejs.press/zh/guide/markdown/sandpack.html)
#### 幻灯片
<iframe src="https://plugin-md-enhance-demo.vuejs.press/snippet/revealjs.html" width="100%" height="400"/>
- [查看详情](https://theme-hope.vuejs.press/zh/guide/markdown/revealjs.html)
[md-enhance]: https://plugin-md-enhance.vuejs.press/zh/

View File

@ -1,125 +0,0 @@
---
# 这是文章的标题
title: 页面配置
# 你可以自定义封面图片
cover: /assets/images/cover1.jpg
# 这是页面的图标
icon: file
# 这是侧边栏的顺序
order: 4
# 设置作者
author: Ms.Hope
# 设置写作时间
date: 2020-01-01
# 一个页面可以有多个分类
category:
- 使用指南
# 一个页面可以有多个标签
tag:
- 页面配置
- 使用指南
# 此页面会在文章列表置顶
sticky: true
# 此页面会出现在星标文章中
star: true
# 你可以自定义页脚
footer: 这是测试显示的页脚
# 你可以自定义版权信息
copyright: 无版权
---
`more` 注释之前的内容被视为文章摘要。
<!-- more -->
## 页面标题
The first H1 title in Markdown will be regarded as page title.
Markdown 中的第一个 H1 标题会被视为页面标题。
你可以在 Markdown 的 Frontmatter 中设置页面标题。
```md
---
title: 页面标题
---
```
## 页面信息
你可以在 Markdown 的 Frontmatter 中设置页面信息。
- 作者设置为 Ms.Hope。
- 写作日期为 2020 年 1 月 1 日
- 分类为 “使用指南”
- 标签为 “页面配置” 和 “使用指南”
## 页面内容
你可以自由在这里书写你的 Markdown。
::: tip 图片引入
- 你可以将图片和 Markdown 文件放置在一起使用相对路径进行引用。
- 对于 `.vuepress/public` 文件夹的图片,请使用绝对链接 `/` 进行引用。
:::
## 组件
每个 Markdown 页面都会被转换为一个 Vue 组件,这意味着你可以在 Markdown 中使用 Vue 语法:
{{ 1 + 1 }}
<!-- markdownlint-disable MD033 -->
<ul>
<li v-for="i in 3">{{ i }}</li>
</ul>
<!-- markdownlint-enable MD033 -->
你也可以创建并引入你自己的组件。
<MyComponent />
<script setup>
import { defineComponent, h, ref } from 'vue';
const MyComponent = defineComponent({
setup() {
const input = ref('Hello world!');
const onInput = (e) => {
input.value = e.target.value;
};
return () => [
h('p', [
h('span','输入: '),
h('input', {
value: input.value,
onInput,
}),
]),
h('p', [h('span','输出: '), input.value]),
];
},
});
</script>
---
主题包含一些有用的组件。这里是一些例子:
- 文字结尾应该有深蓝色的 徽章文字 徽章。 <Badge text="徽章文字" color="#242378" />
- 一个卡片:
```component VPCard
title: Mr.Hope
desc: Where there is light, there is hope
logo: https://mister-hope.com/logo.svg
link: https://mister-hope.com
background: rgba(253, 230, 138, 0.15)
```

View File

@ -1,6 +1,8 @@
---
title: 快速部署
title: 项目部署
index: false
icon: laptop-code
category: 安装和配置
category: 部署
---
<Catalog />

View File

@ -7,3 +7,44 @@ tag:
- 配置
- 部署
---
### 轻雪配置项(Nonebot插件配置项也可以写在此与dotenv格式不同应为小写)
配置文件会在首次启动后生成,你可以在`config.yaml`中修改配置项后重启轻雪
如果不确定字段的含义,请不要修改(部分在自动生成配置文件中未列出,需手动添加)
```yaml
# 生成文件的配置项
command_start: [ "/", " " ] # 指令前缀
host: 127.0.0.1 # 监听地址默认为本机若要对外开放请填写0.0.0.0
port: 20216 # 绑定端口
nickname: [ "liteyuki" ] # 机器人昵称
superusers: [ "1919810" ] # 超级用户
# 未列出的配置项(如要自定义请手动修改)
onebot_access_token: "" # 访问令牌,对公网开放时建议设置
default_language: "zh-CN" # 默认语言支持i18n部分语言和自行扩展的语言代码
log_level: "INFO" # 日志等级
log_icon: true # 是否显示日志等级图标(某些控制台字体不可用)
auto_report: true # 是否自动上报问题给轻雪服务器,仅包含硬件信息和运行软件版本
# 其他Nonebot插件的配置项
custom_config_1: "custom_value1"
custom_config_2: "custom_value2"
...
```
### Onebot实现端配置
不同的实现端给出的字段可能不同,但是基本上都是一样的,这里给出一个参考值
| 字段 | 参考值 | 说明 |
|-------------|---------------------------|----------------------------------|
| 协议 | 反向WebSocket | 推荐使用反向ws协议进行通信即轻雪作为服务端 |
| 地址 | ws://`address`/onebot/v11 | 地址取决于配置文件,本机默认为`127.0.0.1:20216` |
| AccessToken | `""` | 如果你给轻雪配置了`AccessToken`,请在此填写相同的值 |
### 其他通信方式
- 实现端与轻雪的通信方式不局限为反向WebSocket但是推荐使用反向WebSocket。
- 反向WebSocket的优点是轻雪作为服务端可以更好的控制连接适用于生产环境。
- 在某些情况下你也可以使用正向WebSocket比如你在开发轻雪插件时可以使用正向WebSocket主动连接实现端

View File

@ -1,16 +0,0 @@
---
title: 指南
icon: lightbulb
---
## 功能亮点
### Bar
- [baz](bar/baz.md)
- ...
### Foo
- [ray](foo/ray.md)
- ...

View File

@ -1,13 +0,0 @@
---
title: Bar 功能
icon: lightbulb
---
## 介绍
我们支持 bar 功能,...
## 详情
- [baz](baz.md)
- ...

View File

@ -1,6 +0,0 @@
---
title: Baz
icon: circle-info
---
功能详情...

View File

@ -1,13 +0,0 @@
---
title: Foo 功能
icon: lightbulb
---
## 介绍
我们支持 foo 功能,...
## 详情
- [ray](ray.md)
- ...

View File

@ -1,6 +0,0 @@
---
title: Ray
icon: circle-info
---
功能详情...

View File

@ -1,6 +1,8 @@
---
title: 使用指南
title: 使用手册
index: false
icon: laptop-code
category: 使用指南
category: 使用手册
---
<Catalog />

View File

@ -0,0 +1,52 @@
---
title: 基础命令
icon: laptop-code
order: 1
category: 使用手册
---
## 内置插件命令
### 轻雪`liteyuki`
```shell
reload-liteyuki # 重载轻雪
update-liteyuki # 更新轻雪
liteyuki # 查看轻雪信息
```
### 轻雪Nonebot插件管理 `liteyuki_npm`
```shell
npm update # 更新插件索引
npm install <plugin_name> # 安装插件
npm uninstall <plugin_name> # 卸载插件
npm search <keywords...> # 搜索插件
------
别名: npm 插件, update 更新, install 安装, uninstall 卸载, search 搜索
```
```shell
enable <plugin_name> # 启用插件
disable <plugin_name> # 禁用插件
enable-global <plugin_name> # 全局启用插件
disable-global <plugin_name> # 全局禁用插件
list-plugin # 列出所有插件
------
别名: enable 启用, disable 停用, enable-global 全局启用, disable-global 全局停用, list-plugin 列出插件/插件列表
```
### 轻雪用户管理`liteyuki_user`
```shell
profile # 查看用户信息菜单
profile set <key> [value] # 设置用户信息或打开属性设置菜单
profile get <key> # 获取用户信息
------
别名: profile 个人信息, set 设置, get 查询
```
*参数:`<param>`为必填参数,`[param]`为可选参数。*
*命令别名:配置了命令别名的命令可以使用别名代替原命令,例如`npm install ~`可以使用`插件 安装 ~`代替。*

View File

@ -0,0 +1,6 @@
---
title: 功能命令
icon: laptop-code
order: 2
category: 使用手册
---