Skip to content

Commit a0d5916

Browse files
committed
docs: update markdown docs
1 parent 499ba20 commit a0d5916

File tree

4 files changed

+53
-15
lines changed

4 files changed

+53
-15
lines changed

docs/README.md

+8
Original file line numberDiff line numberDiff line change
@@ -6,21 +6,29 @@ actions:
66
- text: Get Started
77
link: /guide/getting-started.html
88
type: primary
9+
910
- text: Introduction
1011
link: /guide/introduction.html
1112
type: secondary
13+
1214
features:
1315
- title: Simplicity First
1416
details: Minimal setup with markdown-centered project structure helps you focus on writing.
17+
1518
- title: Vue-Powered
1619
details: Enjoy the dev experience of Vue, use Vue components in markdown, and develop custom themes with Vue.
20+
1721
- title: Performant
1822
details: VuePress generates pre-rendered static HTML for each page, and runs as an SPA once a page is loaded.
23+
1924
- title: Themes
2025
details: Providing a default theme out of the box. You can also choose a community theme or create your own one.
26+
2127
- title: Plugins
2228
details: Flexible plugin API, allowing plugins to provide lots of plug-and-play features for your site.
29+
2330
- title: Bundlers
2431
details: Recommended bundler is Vite, while Webpack is also supported. Choose the one you like!
32+
2533
footer: MIT Licensed | Copyright © 2018-present VuePress Community
2634
---

docs/guide/markdown.md

+16-6
Original file line numberDiff line numberDiff line change
@@ -156,7 +156,7 @@ Config reference: [markdown.toc](../reference/config.md#markdown-toc)
156156

157157
Following code blocks extensions are implemented during markdown parsing in Node side. That means, the code blocks won't be processed in client side.
158158

159-
Notice that some of the code blocks features require theme support. The default theme of VuePress supports all of them, but community themes might not. You'd better check the theme documentation before using them.
159+
With [@vuepress/plugin-prismjs][prismjs] and [@vuepress/plugin-shiki][shiki], you can highlight code blocks with [Prism](https://prismjs.com/) or [Shiki](https://shiki.style/).
160160

161161
#### Code Title
162162

@@ -194,7 +194,11 @@ export default defineUserConfig({
194194
})
195195
```
196196

197-
It can be used in combination with the other marks below. Please leave a space between them.
197+
::: tip
198+
199+
Code title is supported by highlight plugins by default. It can be used in combination with the other marks below. Please leave a space between them.
200+
201+
:::
198202

199203
#### Line Highlighting
200204

@@ -239,9 +243,11 @@ Examples for line ranges mark:
239243
- Combined: `{4,7-13,16,23-27,40}`
240244

241245
::: tip
242-
This line highlighting extension is supported by our built-in plugin, which is forked and modified from [markdown-it-highlight-lines](https://github.com/egoist/markdown-it-highlight-lines).
243246

244-
Config reference: [markdown.code.highlightLines](../reference/config.md#markdown-code-highlightlines)
247+
Line highlighting extension is supported by highlighter plugins.
248+
249+
Config reference: [prism line highlighting](https://ecosystem.vuejs.press/plugins/markdown/prismjs.html#highlightlines) and [shiki highlighting](https://ecosystem.vuejs.press/plugins/markdown/shiki.html#highlightlines).
250+
245251
:::
246252

247253
#### Line Numbers
@@ -281,9 +287,11 @@ const line3 = 'This is line 3'
281287
```
282288

283289
::: tip
284-
This line numbers extension is supported by our built-in plugin.
285290

286-
Config reference: [markdown.code.lineNumbers](../reference/config.md#markdown-code-linenumbers)
291+
Line numbers extension is supported by highlighter plugins.
292+
293+
Config reference: [prism line numbers](https://ecosystem.vuejs.press/plugins/markdown/prismjs.html#linenumbers) and [shiki line numbers](https://ecosystem.vuejs.press/plugins/markdown/shiki.html#linenumbers).
294+
287295
:::
288296

289297
#### Wrap with v-pre
@@ -346,9 +354,11 @@ const onePlusTwoPlusThree = {{ 1 + 2 + 3 }}
346354
```
347355

348356
::: tip
357+
349358
This v-pre extension is supported by our built-in plugin.
350359

351360
Config reference: [markdown.vPre.block](../reference/config.md#markdown-vpre-block)
361+
352362
:::
353363

354364
### Import Code Blocks

docs/zh/README.md

+8
Original file line numberDiff line numberDiff line change
@@ -6,21 +6,29 @@ actions:
66
- text: 快速上手
77
link: /zh/guide/getting-started.html
88
type: primary
9+
910
- text: 项目简介
1011
link: /zh/guide/introduction.html
1112
type: secondary
13+
1214
features:
1315
- title: 简洁至上
1416
details: 以 Markdown 为中心的项目结构,以最少的配置帮助你专注于写作。
17+
1518
- title: Vue 驱动
1619
details: 享受 Vue 的开发体验,可以在 Markdown 中使用 Vue 组件,又可以使用 Vue 来开发自定义主题。
20+
1721
- title: 高性能
1822
details: VuePress 会为每个页面预渲染生成静态的 HTML,同时,每个页面被加载的时候,将作为 SPA 运行。
23+
1924
- title: 主题
2025
details: 提供了一个开箱即用的默认主题。你也可以挑选一个社区主题,或者创建一个你自己的主题。
26+
2127
- title: 插件
2228
details: 灵活的插件API,使得插件可以为你的站点提供许多即插即用的功能。
29+
2330
- title: 打包工具
2431
details: 推荐的打包工具是 Vite ,但也同样支持使用 Webpack 。选一个你喜欢的来使用吧!
32+
2533
footer: MIT 协议 | 版权所有 © 2018-至今 VuePress 社区
2634
---

docs/zh/guide/markdown.md

+21-9
Original file line numberDiff line numberDiff line change
@@ -155,15 +155,15 @@ Emoji 扩展由 [markdown-it-emoji](https://github.com/markdown-it/markdown-it-e
155155

156156
### 代码块
157157

158-
下列代码块扩展是在 Node 端进行 Markdown 解析的时候实现的。这意味着代码块并不会在客户端被处理
158+
下列代码块扩展都是在 Node 端进行 Markdown 解析时实现的,也就是代码块并不会在客户端被处理
159159

160-
需要注意的是,部分代码块功能需要主题支持。VuePress 默认主题支持所有这些功能,但社区主题有可能不支持。请查看你使用的主题文档来确认是否支持这些功能
160+
通过 [@vuepress/plugin-prismjs][prismjs][@vuepress/plugin-shiki][shiki],你可以通过 [Prism](https://prismjs.com/)[Shiki](https://shiki.tmrs.site/) 来高亮代码块
161161

162162
#### 代码标题
163163

164164
你可以在代码块添加一个 `title` 键值对来为代码块设置标题。
165165

166-
**Input**
166+
**输入**
167167

168168
````md
169169
```ts title=".vuepress/config.ts"
@@ -180,7 +180,7 @@ export default defineUserConfig({
180180
```
181181
````
182182

183-
**Output**
183+
**输出**
184184

185185
```ts title=".vuepress/config.ts"
186186
import { defaultTheme } from '@vuepress/theme-default'
@@ -195,7 +195,11 @@ export default defineUserConfig({
195195
})
196196
```
197197

198-
它可以和下列的其他标记一起使用。请在它们之间使用空格分隔。
198+
::: tip
199+
200+
代码标题是通过高亮器插件默认支持的。它可以和下列的其他标记一起使用。请在它们之间使用空格分隔。
201+
202+
:::
199203

200204
#### 行高亮
201205

@@ -240,9 +244,11 @@ export default defineUserConfig({
240244
- 组合: `{4,7-13,16,23-27,40}`
241245

242246
::: tip
243-
行高亮扩展是由我们的内置插件支持的,该扩展 Fork 并修改自 [markdown-it-highlight-lines](https://github.com/egoist/markdown-it-highlight-lines)
244247

245-
配置参考: [markdown.code.highlightLines](../reference/config.md#markdown-code-highlightlines)
248+
行高亮扩展是通过高亮器插件默认支持的。
249+
250+
配置参考:[prism 行高亮](https://ecosystem.vuejs.press/zh/plugins/markdown/prismjs.html#highlightlines)[shiki 行高亮](https://ecosystem.vuejs.press/zh/plugins/markdown/shiki.html#highlightlines)
251+
246252
:::
247253

248254
#### 行号
@@ -282,9 +288,11 @@ const line3 = 'This is line 3'
282288
```
283289

284290
::: tip
285-
行号扩展是由我们的内置插件支持的。
286291

287-
配置参考: [markdown.code.lineNumbers](../reference/config.md#markdown-code-linenumbers)
292+
行号扩展是通过高亮器插件默认支持的。
293+
294+
配置参考:[prism 行号](https://ecosystem.vuejs.press/zh/plugins/markdown/prismjs.html#linenumbers)[shiki 行号](https://ecosystem.vuejs.press/zh/plugins/markdown/shiki.html#linenumbers)
295+
288296
:::
289297

290298
#### 添加 v-pre
@@ -296,9 +304,11 @@ const line3 = 'This is line 3'
296304
你可以在代码块添加 `:v-pre` / `:no-v-pre` 标记来覆盖配置项中的设置。
297305

298306
::: warning
307+
299308
模板语法的字符有可能会被语法高亮器解析,比如 "Mustache" 语法(即双花括号)。因此,就像下面的例子一样,在某些语言中 `:no-v-pre` 可能并不能生效。
300309

301310
如果你无论如何都想在这种语言中使用 Vue 语法,你可以尝试禁用默认的语法高亮,然后在客户端实现你的自定义代码高亮。
311+
302312
:::
303313

304314
**输入**
@@ -347,9 +357,11 @@ const onePlusTwoPlusThree = {{ 1 + 2 + 3 }}
347357
```
348358

349359
::: tip
360+
350361
v-pre 扩展是由我们的内置插件支持的。
351362

352363
配置参考: [markdown.vPre.block](../reference/config.md#markdown-vpre-block)
364+
353365
:::
354366

355367
### 导入代码块

0 commit comments

Comments
 (0)