style: lint fix
This commit is contained in:
pengzhanbo
parent
030a62d22e
commit
12bee93df0
@ -12,7 +12,7 @@ tags:
|
||||
|
||||
标题会自动应用锚点。
|
||||
|
||||
#### 自定义锚点
|
||||
### 自定义锚点
|
||||
|
||||
要为标题指定自定义锚点而不是使用自动生成的锚点，请向标题添加后缀：
|
||||
|
||||
@ -29,7 +29,7 @@ tags:
|
||||
主题默认对每个 md 文件自动生成一个新的 链接，并保存在对应的 md 文件的 frontmatter 的 `permalink` 中。
|
||||
你可以随时修改它们。
|
||||
|
||||
#### 内部链接
|
||||
### 内部链接
|
||||
|
||||
建议使用 生成的 `permalink` 作为内部链接的目标。
|
||||
|
||||
@ -49,7 +49,7 @@ tags:
|
||||
|
||||
## Github风格的表格
|
||||
|
||||
**输入**
|
||||
**输入：**
|
||||
|
||||
```md
|
||||
| Tables | Are | Cool |
|
||||
@ -59,7 +59,7 @@ tags:
|
||||
| zebra stripes | are neat | $1 |
|
||||
```
|
||||
|
||||
**输出**
|
||||
**输出：**
|
||||
|
||||
| Tables | Are | Cool |
|
||||
| ------------- | :-----------: | ----: |
|
||||
@ -69,13 +69,13 @@ tags:
|
||||
|
||||
## Emoji :tada:
|
||||
|
||||
**输入**
|
||||
**输入：**
|
||||
|
||||
```md
|
||||
:tada: :100:
|
||||
```
|
||||
|
||||
**输出**
|
||||
**输出：**
|
||||
|
||||
:tada: :100:
|
||||
|
||||
@ -83,13 +83,13 @@ tags:
|
||||
|
||||
## 目录表
|
||||
|
||||
**输入**
|
||||
**输入：**
|
||||
|
||||
```md
|
||||
[[TOC]]
|
||||
```
|
||||
|
||||
**输出**
|
||||
**输出：**
|
||||
|
||||
[[TOC]]
|
||||
|
||||
@ -99,7 +99,7 @@ tags:
|
||||
|
||||
### 默认标题
|
||||
|
||||
**输入**
|
||||
**输入：**
|
||||
|
||||
```md
|
||||
::: note
|
||||
@ -127,7 +127,7 @@ This is a details block.
|
||||
:::
|
||||
```
|
||||
|
||||
**输出**
|
||||
**输出：**
|
||||
|
||||
::: note
|
||||
This is a note box
|
||||
@ -157,7 +157,7 @@ This is a details block.
|
||||
|
||||
可以通过在容器的 "type" 之后附加文本来设置自定义标题。
|
||||
|
||||
**输入**
|
||||
**输入：**
|
||||
|
||||
````md
|
||||
::: caution STOP
|
||||
@ -171,23 +171,25 @@ console.log('Hello, VitePress!')
|
||||
:::
|
||||
````
|
||||
|
||||
**输出**
|
||||
**输出：**
|
||||
|
||||
::: caution STOP
|
||||
危险区域，请勿继续
|
||||
:::
|
||||
|
||||
::: details 点我查看代码
|
||||
|
||||
```js
|
||||
console.log('Hello, VitePress!')
|
||||
```
|
||||
|
||||
:::
|
||||
|
||||
## GitHub 风格的警报
|
||||
|
||||
主题 同样支持以标注的方式渲染 [GitHub 风格的警报](https://docs.github.com/en/get-started/writing-on-github/getting-started-with-writing-and-formatting-on-github/basic-writing-and-formatting-syntax#alerts)。它们和[自定义容器](#自定义容器)的渲染方式相同。
|
||||
|
||||
**输入**
|
||||
**输入：**
|
||||
|
||||
```md
|
||||
> [!NOTE]
|
||||
@ -206,7 +208,7 @@ console.log('Hello, VitePress!')
|
||||
> 行为可能带来的负面影响。
|
||||
```
|
||||
|
||||
**输出**
|
||||
**输出：**
|
||||
|
||||
> [!NOTE]
|
||||
> 强调用户在快速浏览文档时也不应忽略的重要信息。
|
||||
@ -228,7 +230,7 @@ console.log('Hello, VitePress!')
|
||||
主题 使用 [Shiki](https://github.com/shikijs/shiki) 在 Markdown 代码块中使用彩色文本实现语法高亮。
|
||||
Shiki 支持多种编程语言。需要做的就是将有效的语言别名附加到代码块的开头：
|
||||
|
||||
**输入**
|
||||
**输入：**
|
||||
|
||||
````
|
||||
```js
|
||||
@ -249,7 +251,7 @@ export default {
|
||||
```
|
||||
````
|
||||
|
||||
**输出**
|
||||
**输出：**
|
||||
|
||||
```js
|
||||
export default {
|
||||
@ -270,7 +272,7 @@ export default {
|
||||
|
||||
## 在代码块中实现行高亮
|
||||
|
||||
**输入**
|
||||
**输入：**
|
||||
|
||||
````
|
||||
```js{4}
|
||||
@ -284,7 +286,7 @@ export default {
|
||||
```
|
||||
````
|
||||
|
||||
**输出**
|
||||
**输出：**
|
||||
|
||||
```js{4}
|
||||
export default {
|
||||
@ -302,7 +304,7 @@ export default {
|
||||
- 多个单行：例如 `{4,7,9}`
|
||||
- 多行与单行：例如 `{4,7-13,16,23-27,40}`
|
||||
|
||||
**输入**
|
||||
**输入：**
|
||||
|
||||
````
|
||||
```js{1,4,6-8}
|
||||
@ -320,7 +322,7 @@ export default { // Highlighted
|
||||
```
|
||||
````
|
||||
|
||||
**输出**
|
||||
**输出：**
|
||||
|
||||
```js{1,4,6-8}
|
||||
export default { // Highlighted
|
||||
@ -338,7 +340,7 @@ export default { // Highlighted
|
||||
|
||||
也可以使用 `// [!code highlight]` 注释实现行高亮。
|
||||
|
||||
**输入**
|
||||
**输入：**
|
||||
|
||||
````
|
||||
```js
|
||||
@ -352,7 +354,7 @@ export default {
|
||||
```
|
||||
````
|
||||
|
||||
**输出**
|
||||
**输出：**
|
||||
|
||||
```js
|
||||
export default {
|
||||
@ -370,7 +372,7 @@ export default {
|
||||
|
||||
此外，可以使用 `// [!code focus:<lines>]` 定义要聚焦的行数。
|
||||
|
||||
**输入**
|
||||
**输入：**
|
||||
|
||||
````
|
||||
```js
|
||||
@ -384,7 +386,7 @@ export default {
|
||||
```
|
||||
````
|
||||
|
||||
**输出**
|
||||
**输出：**
|
||||
|
||||
```js
|
||||
export default {
|
||||
@ -400,29 +402,29 @@ export default {
|
||||
|
||||
在某一行添加 `// [!code --]` 或 `// [!code ++]` 注释将会为该行创建 diff，同时保留代码块的颜色。
|
||||
|
||||
**输入**
|
||||
**输入：**
|
||||
|
||||
````
|
||||
```js
|
||||
export default {
|
||||
data () {
|
||||
return {
|
||||
msg: 'Removed', // [\!code --]
|
||||
msg: 'Added' // [\!code ++]
|
||||
remove: 'Removed', // [\!code --]
|
||||
add: 'Added' // [\!code ++]
|
||||
}
|
||||
}
|
||||
}
|
||||
```
|
||||
````
|
||||
|
||||
**输出**
|
||||
**输出：**
|
||||
|
||||
```js
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
msg: 'Removed', // [!code --]
|
||||
msg: 'Added' // [!code ++]
|
||||
remove: 'Removed', // [!code --]
|
||||
add: 'Added' // [!code ++]
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -432,29 +434,29 @@ export default {
|
||||
|
||||
在某一行添加 `// [!code warning]` 或 `// [!code error]` 注释将会为该行相应的着色。
|
||||
|
||||
**输入**
|
||||
**输入：**
|
||||
|
||||
````
|
||||
```js
|
||||
export default {
|
||||
data () {
|
||||
return {
|
||||
msg: 'Error', // [\!code error]
|
||||
msg: 'Warning' // [\!code warning]
|
||||
error: 'Error', // [\!code error]
|
||||
warning: 'Warning' // [\!code warning]
|
||||
}
|
||||
}
|
||||
}
|
||||
```
|
||||
````
|
||||
|
||||
**输出**
|
||||
**输出：**
|
||||
|
||||
```js
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
msg: 'Error', // [!code error]
|
||||
msg: 'Warning' // [!code warning]
|
||||
error: 'Error', // [!code error]
|
||||
warning: 'Warning' // [!code warning]
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -462,7 +464,7 @@ export default {
|
||||
|
||||
## 代码块中 词高亮
|
||||
|
||||
**输入**
|
||||
**输入：**
|
||||
|
||||
````
|
||||
```ts
|
||||
@ -473,7 +475,7 @@ export function foo() { // [\!code word:Hello]
|
||||
```
|
||||
````
|
||||
|
||||
**输出**
|
||||
**输出：**
|
||||
|
||||
```ts
|
||||
export function foo() { // [!code word:Hello]
|
||||
@ -484,7 +486,7 @@ export function foo() { // [!code word:Hello]
|
||||
|
||||
你还可以指定高亮显示的次数，例如 `[!code word:options:2]` 会高亮显示近两个 `options`。
|
||||
|
||||
**输入**
|
||||
**输入：**
|
||||
|
||||
````
|
||||
```ts
|
||||
@ -495,7 +497,7 @@ console.log(options.foo) // 这个不会被高亮显示
|
||||
```
|
||||
````
|
||||
|
||||
**输出**
|
||||
**输出：**
|
||||
|
||||
```ts
|
||||
// [!code word:options:2]
|
||||
@ -508,7 +510,7 @@ console.log(options.foo) // 这个不会被高亮显示
|
||||
|
||||
可以像这样对多个代码块进行分组：
|
||||
|
||||
**输入**
|
||||
**输入：**
|
||||
|
||||
````md
|
||||
::: code-tabs
|
||||
@ -537,10 +539,11 @@ export default config
|
||||
:::
|
||||
````
|
||||
|
||||
**输出**
|
||||
**输出：**
|
||||
|
||||
::: code-tabs
|
||||
@tab config.js
|
||||
|
||||
```js
|
||||
/**
|
||||
* @type {import('vuepress').UserConfig}
|
||||
@ -551,7 +554,9 @@ const config = {
|
||||
|
||||
export default config
|
||||
```
|
||||
|
||||
@tab config.ts
|
||||
|
||||
```ts
|
||||
import type { UserConfig } from 'vuepress'
|
||||
|
||||
@ -561,13 +566,14 @@ const config: UserConfig = {
|
||||
|
||||
export default config
|
||||
```
|
||||
|
||||
:::
|
||||
|
||||
你还可以通过 `@tab:active`
|
||||
|
||||
## 导入代码块
|
||||
|
||||
**输入**
|
||||
**输入：**
|
||||
|
||||
你可以使用下面的语法，从文件中导入代码块：
|
||||
|
||||
@ -575,7 +581,7 @@ export default config
|
||||
@[code](../snippet/snippet-1.js)
|
||||
```
|
||||
|
||||
**输出**
|
||||
**输出：**
|
||||
|
||||
@[code](../notes/theme/snippet/snippet-1.js)
|
||||
|
||||
@ -598,7 +604,7 @@ export default config
|
||||
|
||||
## 数学方程
|
||||
|
||||
**输入**
|
||||
**输入：**
|
||||
|
||||
````
|
||||
When $a \ne 0$, there are two solutions to $(ax^2 + bx + c = 0)$ and they are
|
||||
@ -613,7 +619,7 @@ $$ x = {-b \pm \sqrt{b^2-4ac} \over 2a} $$
|
||||
| $\nabla \times \vec{\mathbf{B}} -\, \frac1c\, \frac{\partial\vec{\mathbf{E}}}{\partial t} = \frac{4\pi}{c}\vec{\mathbf{j}} \nabla \cdot \vec{\mathbf{E}} = 4 \pi \rho$ | _wha?_ |
|
||||
````
|
||||
|
||||
**输出**
|
||||
**输出：**
|
||||
|
||||
When $a \ne 0$, there are two solutions to $(ax^2 + bx + c = 0)$ and they are
|
||||
$$ x = {-b \pm \sqrt{b^2-4ac} \over 2a} $$
|
||||
@ -630,13 +636,13 @@ $$ x = {-b \pm \sqrt{b^2-4ac} \over 2a} $$
|
||||
|
||||
使用 `== ==` 进行标记。请注意两边需要有空格。
|
||||
|
||||
**输入**
|
||||
**输入：**
|
||||
|
||||
```md
|
||||
vuepress-theme-plume 是一个 ==简洁美观== 的 主题
|
||||
```
|
||||
|
||||
**输出**
|
||||
**输出：**
|
||||
|
||||
vuepress-theme-plume 是一个 ==简洁美观== 的 主题
|
||||
|
||||
@ -645,21 +651,21 @@ vuepress-theme-plume 是一个 ==简洁美观== 的 主题
|
||||
- 使用 `^ ^` 进行上角标标注。
|
||||
- 使用 `~ ~` 进行下角标标注。
|
||||
|
||||
**输入**
|
||||
**输入：**
|
||||
|
||||
```md
|
||||
- 19^th^
|
||||
- H~2~O
|
||||
```
|
||||
|
||||
**输出**
|
||||
**输出：**
|
||||
|
||||
- 19^th^
|
||||
- H~2~O
|
||||
|
||||
## 自定义对齐
|
||||
|
||||
**输入**
|
||||
**输入：**
|
||||
|
||||
````md
|
||||
::: left
|
||||
@ -675,7 +681,7 @@ vuepress-theme-plume 是一个 ==简洁美观== 的 主题
|
||||
:::
|
||||
````
|
||||
|
||||
**输出**
|
||||
**输出：**
|
||||
|
||||
::: left
|
||||
左对齐的内容
|
||||
@ -693,9 +699,10 @@ vuepress-theme-plume 是一个 ==简洁美观== 的 主题
|
||||
|
||||
你可以使用特殊标记为 Markdown 元素添加属性。
|
||||
|
||||
**为图片添加属性**
|
||||
**为图片添加属性：**
|
||||
|
||||
这将为图片添加 一个 名为 `full-width` 的 class 属性，以及一个 `width` 属性，值为 `100%`。
|
||||
|
||||
```md
|
||||
{.full-width width="100%"}
|
||||
```
|
||||
@ -716,7 +723,7 @@ vuepress-theme-plume 是一个 ==简洁美观== 的 主题
|
||||
|
||||
## 任务列表
|
||||
|
||||
**输入**
|
||||
**输入：**
|
||||
|
||||
````md
|
||||
- [ ] 任务 1
|
||||
@ -724,7 +731,7 @@ vuepress-theme-plume 是一个 ==简洁美观== 的 主题
|
||||
- [ ] 任务 3
|
||||
````
|
||||
|
||||
**输出**
|
||||
**输出：**
|
||||
|
||||
- [ ] 任务 1
|
||||
- [x] 任务 2
|
||||
@ -732,7 +739,7 @@ vuepress-theme-plume 是一个 ==简洁美观== 的 主题
|
||||
|
||||
## 脚注
|
||||
|
||||
**输入**
|
||||
**输入：**
|
||||
|
||||
````md
|
||||
人生自古谁无死，留取丹心照汗青[^脚注1]。
|
||||
@ -740,7 +747,7 @@ vuepress-theme-plume 是一个 ==简洁美观== 的 主题
|
||||
[^脚注1]: 出自 宋·文天祥 **《过零丁洋》**
|
||||
````
|
||||
|
||||
**输出**
|
||||
**输出：**
|
||||
|
||||
人生自古谁无死，留取丹心照汗青[^脚注1]。
|
||||
|
||||
|
||||
@ -208,8 +208,8 @@ export default {
|
||||
export default {
|
||||
data () {
|
||||
return {
|
||||
msg: 'Removed', // [\!code --]
|
||||
msg: 'Added' // [\!code ++]
|
||||
error: 'Removed', // [\!code --]
|
||||
warning: 'Added' // [\!code ++]
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -222,8 +222,8 @@ export default {
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
msg: 'Removed', // [!code --]
|
||||
msg: 'Added' // [!code ++]
|
||||
error: 'Removed', // [!code --]
|
||||
warning: 'Added' // [!code ++]
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -240,8 +240,8 @@ export default {
|
||||
export default {
|
||||
data () {
|
||||
return {
|
||||
msg: 'Error', // [\!code error]
|
||||
msg: 'Warning' // [\!code warning]
|
||||
error: 'Error', // [\!code error]
|
||||
warning: 'Warning' // [\!code warning]
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -254,8 +254,8 @@ export default {
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
msg: 'Error', // [!code error]
|
||||
msg: 'Warning' // [!code warning]
|
||||
error: 'Error', // [!code error]
|
||||
warning: 'Warning' // [!code warning]
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -39,9 +39,9 @@ useEventListener('message', (event) => {
|
||||
const { type, payload } = data
|
||||
if (
|
||||
type === 'ciu_embed'
|
||||
&& payload
|
||||
&& payload.feature === props.feature
|
||||
&& payload.meta === props.meta
|
||||
&& payload
|
||||
&& payload.feature === props.feature
|
||||
&& payload.meta === props.meta
|
||||
) {
|
||||
height.value = `${Math.ceil(payload.height)}px`
|
||||
}
|
||||
|
||||
@ -45,7 +45,7 @@ yarn add vuepress-plugin-netlify-functions
|
||||
|
||||
2. In a vuepress plugin:
|
||||
|
||||
``` js
|
||||
``` ts
|
||||
import { useNetlifyFunctionsPlugin } from 'vuepress-plugin-netlify-functions'
|
||||
|
||||
function myPlugin(): Plugin {
|
||||
|
||||
@ -42,7 +42,7 @@ yarn add vuepress-plugin-netlify-functions
|
||||
|
||||
2. 在 vuepress plugin 中：
|
||||
|
||||
``` js
|
||||
``` ts
|
||||
import { useNetlifyFunctionsPlugin } from 'vuepress-plugin-netlify-functions'
|
||||
|
||||
function myPlugin(): Plugin {
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user