Skip to content

Commit

Permalink
Merge branch 'main' into theme-hope
Browse files Browse the repository at this point in the history
  • Loading branch information
Mister-Hope committed Jul 14, 2024
2 parents 15f941c + 5cfa771 commit cdfbc06
Show file tree
Hide file tree
Showing 10 changed files with 1,644 additions and 1,650 deletions.
10 changes: 5 additions & 5 deletions docs/guide/markdown.md
Original file line number Diff line number Diff line change
Expand Up @@ -162,7 +162,7 @@ Following code blocks extensions are implemented during markdown parsing in Node

#### Code Title

You can specify the title of the code block by adding a `title` key-value mark in your fenced code blocks.
You can specify the title of the code block by adding a `title` key-value mark in your fenced code blocks. Note: This requires theme support.

**Input**

Expand Down Expand Up @@ -200,7 +200,7 @@ It can be used in combination with the other marks below. Please leave a space b

#### Line Highlighting

You can highlight specified lines of your code blocks by adding line ranges mark in your fenced code blocks:
You can highlight specified lines of your code blocks by adding line ranges mark in your fenced code blocks. Note: This requires highlighter plugin and theme support.

**Input**

Expand Down Expand Up @@ -248,9 +248,9 @@ Config reference: [markdown.code.highlightLines](../reference/config.md#markdown

#### Line Numbers

You must have noticed that the number of lines is displayed on the left side of code blocks. This is enabled by default and you can disable it in config.
You must have noticed that the number of lines is displayed on the left side of code blocks.

You can add `:line-numbers` / `:no-line-numbers` mark in your fenced code blocks to override the value set in config.
You can add `:line-numbers` / `:no-line-numbers` mark in your fenced code blocks to override the value set in config. Note: This requires highlighter plugin and theme support.

**Input**

Expand Down Expand Up @@ -350,7 +350,7 @@ const onePlusTwoPlusThree = {{ 1 + 2 + 3 }}
::: tip
This v-pre extension is supported by our built-in plugin.

Config reference: [markdown.code.vPre.block](../reference/config.md#markdown-code-vpre-block)
Config reference: [markdown.vPre.block](../reference/config.md#markdown-vpre-block)
:::

### Import Code Blocks
Expand Down
9 changes: 6 additions & 3 deletions docs/guide/migration.md
Original file line number Diff line number Diff line change
Expand Up @@ -149,9 +149,9 @@ Renamed to `pagePatterns`

#### markdown.lineNumbers

Moved to [markdown.code.lineNumbers](../reference/config.md#markdown-code-linenumbers).
Removed.

Default value is changed from `false` to `true`.
The same feature is implemented in [@vuepress/plugin-prismjs][prismjs] and [@vuepress/plugin-shiki][shiki].

#### markdown.pageSuffix

Expand Down Expand Up @@ -418,7 +418,7 @@ Some major breaking changes:
- Always provide a valid js entry file, and do not use `"main": "layouts/Layout.vue"` as the theme entry anymore.
- `themeConfig` is removed from user config and site data. To access the `themeConfig` as you would via `this.$site.themeConfig` in v1, we now recommend using the [@vuepress/plugin-theme-data](https://ecosystem.vuejs.press/plugins/theme-data.html) plugin and its `useThemeData` composition API.
- Stylus is no longer the default CSS pre-processor, and the stylus palette system is not embedded. If you still want to use similar palette system as v1, [@vuepress/plugin-palette](https://ecosystem.vuejs.press/plugins/palette.html) may help.
- Markdown code blocks syntax highlighting by Prism.js is not embedded by default. You can use either [@vuepress/plugin-prismjs](https://ecosystem.vuejs.press/plugins/prismjs.html) or [@vuepress/plugin-shiki](https://ecosystem.vuejs.press/plugins/shiki.html), or implement syntax highlighting in your own way.
- Markdown code blocks syntax highlighting by Prism.js is not embedded by default. You can use either [@vuepress/plugin-prismjs][prismjs] or [@vuepress/plugin-shiki][shiki], or implement syntax highlighting in your own way.
- For scalability concerns, `this.$site.pages` is not available any more. See [Advanced > Cookbook > Resolving Routes](../advanced/cookbook/resolving-routes.md) for how to retrieve pages data in v2.

For more detailed guide about how to write a theme in v2, see [Advanced > Writing a Theme](../advanced/theme.md).
Expand All @@ -442,3 +442,6 @@ You can still inherit a parent theme with `extends: parentTheme()`, which will e
You can refer to [Default Theme > Extending](https://ecosystem.vuejs.press/themes/default/extending.html) for how to extend default theme.

The `@theme` and `@parent-theme` aliases are removed by default, but you can still make a extendable theme with similar approach, see [Advanced > Cookbook > Making a Theme Extendable](../advanced/cookbook/making-a-theme-extendable.md).

[prismjs]: https://ecosystem.vuejs.press/plugins/prismjs.html
[shiki]: https://ecosystem.vuejs.press/plugins/shiki.html
2 changes: 1 addition & 1 deletion docs/guide/plugin.md
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@ With the help of [Plugin API](../reference/plugin-api.md), VuePress plugin can p

VuePress team provides some official plugins.

You need to import and use them in your config file via the [plugins](../reference/config.md#plugins) option. For example, use the [@vuepress/plugin-google-analytics](https://ecosystem.vuejs.press/plugins/google-analytics.html) to integrate Google Analytics:
You need to import and use them in your config file via the [plugins](../reference/config.md#plugins) option. For example, use the [@vuepress/plugin-google-analytics](https://ecosystem.vuejs.press/plugins/analytics/google-analytics.html) to integrate Google Analytics:

```ts
import { googleAnalyticsPlugin } from '@vuepress/plugin-google-analytics'
Expand Down
110 changes: 26 additions & 84 deletions docs/reference/config.md
Original file line number Diff line number Diff line change
Expand Up @@ -404,90 +404,6 @@ const defaultOptions = {
You should not configure it unless you understand what it is for.
:::

### markdown.code

- Type: `CodePluginOptions | false`

- Details:

Options for VuePress built-in markdown-it code plugin.

Set to `false` to disable this plugin.

- Also see:
- [Guide > Markdown > Syntax Extensions > Code Blocks](../guide/markdown.md#code-blocks)

#### markdown.code.highlightLines

- Type: `boolean`

- Default: `true`

- Details:

Enable code line highlighting or not.

- Also see:
- [Guide > Markdown > Syntax Extensions > Code Blocks > Line Highlighting](../guide/markdown.md#line-highlighting)

#### markdown.code.lineNumbers

- Type: `boolean | number`

- Default: `true`

- Details:

Configure code line numbers.

- A `boolean` value is to enable line numbers or not.
- A `number` value is the minimum number of lines to enable line numbers. For example, if you set it to `4`, line numbers will only be enabled when your code block has at least 4 lines of code.

- Also see:
- [Guide > Markdown > Syntax Extensions > Code Blocks > Line Numbers](../guide/markdown.md#line-numbers)

#### markdown.code.preWrapper

- Type: `boolean`

- Default: `true`

- Details:

Enable the extra wrapper of the `<pre>` tag or not.

The wrapper is required by the `highlightLines` and `lineNumbers`. That means, if you disable `preWrapper`, the line highlighting and line numbers will also be disabled.

::: tip
You can disable it if you want to implement them in client side. For example, [Prismjs Line Highlight](https://prismjs.com/plugins/line-highlight/) or [Prismjs Line Numbers](https://prismjs.com/plugins/line-numbers/).
:::

#### markdown.code.vPre.block

- Type: `boolean`

- Default: `true`

- Details:

Add `v-pre` directive to `<pre>` tag of code block or not.

- Also see:
- [Guide > Markdown > Syntax Extensions > Code Blocks > Wrap with v-pre](../guide/markdown.md#wrap-with-v-pre)

#### markdown.code.vPre.inline

- Type: `boolean`

- Default: `true`

- Details:

Add `v-pre` directive to `<code>` tag of inline code or not.

- Also see:
- [Guide > Markdown > Syntax Extensions > Code Blocks > Wrap with v-pre](../guide/markdown.md#wrap-with-v-pre)

### markdown.component

- Type: `undefined | false`
Expand Down Expand Up @@ -675,6 +591,32 @@ const defaultOptions = {
- Also see:
- [Guide > Markdown > Syntax Extensions > Table of Contents](../guide/markdown.md#table-of-contents)

#### markdown.vPre.block

- Type: `boolean`

- Default: `true`

- Details:

Add `v-pre` directive to `<pre>` tag of code block or not.

- Also see:
- [Guide > Markdown > Syntax Extensions > Code Blocks > Wrap with v-pre](../guide/markdown.md#wrap-with-v-pre)

#### markdown.vPre.inline

- Type: `boolean`

- Default: `true`

- Details:

Add `v-pre` directive to `<code>` tag of inline code or not.

- Also see:
- [Guide > Markdown > Syntax Extensions > Code Blocks > Wrap with v-pre](../guide/markdown.md#wrap-with-v-pre)

## Plugin Config

### plugins
Expand Down
8 changes: 4 additions & 4 deletions docs/zh/guide/markdown.md
Original file line number Diff line number Diff line change
Expand Up @@ -163,7 +163,7 @@ Emoji 扩展由 [markdown-it-emoji](https://github.com/markdown-it/markdown-it-e

#### 代码标题

你可以在代码块添加一个 `title` 键值对来为代码块设置标题。
你可以在代码块添加一个 `title` 键值对来为代码块设置标题。提示:需要主题支持。

**Input**

Expand Down Expand Up @@ -201,7 +201,7 @@ export default defineUserConfig({

#### 行高亮

你可以在代码块添加行数范围标记,来为对应代码行进行高亮
你可以在代码块添加行数范围标记,来为对应代码行进行高亮。提示:它需要高亮器插件和主题支持。

**输入**

Expand Down Expand Up @@ -249,7 +249,7 @@ export default defineUserConfig({

#### 行号

你肯定已经注意到在代码块的最左侧会展示行号。这个功能是默认启用的,你可以通过配置来禁用它。
你肯定已经注意到在代码块的最左侧会展示行号。这个功能是默认启用的,你可以通过配置来禁用它。提示:它需要高亮器插件和主题支持。

你可以在代码块添加 `:line-numbers` / `:no-line-numbers` 标记来覆盖配置项中的设置。

Expand Down Expand Up @@ -351,7 +351,7 @@ const onePlusTwoPlusThree = {{ 1 + 2 + 3 }}
::: tip
v-pre 扩展是由我们的内置插件支持的。

配置参考: [markdown.code.vPre.block](../reference/config.md#markdown-code-vpre-block)
配置参考: [markdown.vPre.block](../reference/config.md#markdown-vpre-block)
:::

### 导入代码块
Expand Down
9 changes: 6 additions & 3 deletions docs/zh/guide/migration.md
Original file line number Diff line number Diff line change
Expand Up @@ -149,9 +149,9 @@ npm i -D @vuepress/theme-default@next

#### markdown.lineNumbers

移动至 [markdown.code.lineNumbers](../reference/config.md#markdown-code-linenumbers)
移除

默认值从 `false` 更改为 `true`
相同的功能改在 [@vuepress/plugin-prismjs][prismjs][@vuepress/plugin-shiki][shiki] 提供

#### markdown.pageSuffix

Expand Down Expand Up @@ -420,7 +420,7 @@ v1 的主题和插件和 v2 并不兼容。
- 你始终需要提供一个合法的 JS 入口文件,不要再使用 `"main": "layouts/Layout.vue"` 作为主题入口。
- `themeConfig` 已经从用户配置和站点数据中移除。如果你想要像 v1 一样通过 `this.$site.themeConfig` 来访问 `themeConfig` ,我们现在建议使用 [@vuepress/plugin-theme-data](https://ecosystem.vuejs.press/zh/plugins/theme-data.html) 插件和它提供的 Composition API `useThemeData`
- Stylus 不再是默认的 CSS 预处理器,并且 Stylus 调色板系统不再被默认支持。如果你仍然想要使用和 v1 类似的调色板系统,可以使用 [@vuepress/plugin-palette](https://ecosystem.vuejs.press/zh/plugins/palette.html)
- 由 Prism.js 提供的 Markdown 代码块的语法高亮不再被默认支持。你可以选择使用 [@vuepress/plugin-prismjs](https://ecosystem.vuejs.press/zh/plugins/prismjs.html)[@vuepress/plugin-shiki](https://ecosystem.vuejs.press/zh/plugins/plugin/shiki.html) ,或者用你自己的方式实现语法高亮。
- 由 Prism.js 提供的 Markdown 代码块的语法高亮不再被默认支持。你可以选择使用 [@vuepress/plugin-prismjs][prismjs][@vuepress/plugin-shiki][shiki] ,或者用你自己的方式实现语法高亮。
- 考虑到可扩展性, `this.$site.pages` 不再可用。查看 [深入 > Cookbook > 解析路由](../advanced/cookbook/resolving-routes.md) 了解如何在 v2 中获取页面的数据。

你可以参考 [深入 > 开发主题](../advanced/theme.md) 来了解如何开发一个 v2 主题。
Expand All @@ -444,3 +444,6 @@ v1 的主题和插件和 v2 并不兼容。
你可以参考 [默认主题 > 继承](https://ecosystem.vuejs.press/zh/themes/default/extending.html) 来了解如何继承默认主题。

`@theme``@parent-theme` 别名默认被移除了,但你仍然可以使用类似的方式来开发一个可继承的主题,参考 [深入 > Cookbook > 开发一个可继承的主题](../advanced/cookbook/making-a-theme-extendable.md)

[prismjs]: https://ecosystem.vuejs.press/zh/plugins/prismjs.html
[shiki]: https://ecosystem.vuejs.press/zh/plugins/shiki.html
2 changes: 1 addition & 1 deletion docs/zh/guide/plugin.md
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@ icon: fa6-solid:plug

VuePress 团队提供了一些官方插件。

你需要在你的配置文件中通过 [plugins](../reference/config.md#plugins) 配置项来使用它们。举例来说,你可以使用 [@vuepress/plugin-google-analytics](https://ecosystem.vuejs.press/zh/plugins/google-analytics.html) 来使用 Google Analytics :
你需要在你的配置文件中通过 [plugins](../reference/config.md#plugins) 配置项来使用它们。举例来说,你可以使用 [@vuepress/plugin-google-analytics](https://ecosystem.vuejs.press/zh/plugins/analytics/google-analytics.html) 来使用 Google Analytics :

```ts
import { googleAnalyticsPlugin } from '@vuepress/plugin-google-analytics'
Expand Down
110 changes: 26 additions & 84 deletions docs/zh/reference/config.md
Original file line number Diff line number Diff line change
Expand Up @@ -403,90 +403,6 @@ const defaultOptions = {
除非你了解它的用途,否则你不应该设置该配置项。
:::

### markdown.code

- 类型: `CodePluginOptions | false`

- 详情:

VuePress 内置的 markdown-it code 插件的配置项。

设置为 `false` 可以禁用该插件。

- 参考:
- [指南 > Markdown > 语法扩展 > 代码块](../guide/markdown.md#代码块)

#### markdown.code.highlightLines

- 类型: `boolean`

- 默认值: `true`

- 详情:

是否启用代码块行高亮。

- 参考:
- [指南 > Markdown > 语法扩展 > 代码块 > 行高亮](../guide/markdown.md#行高亮)

#### markdown.code.lineNumbers

- 类型: `boolean | number`

- 默认值: `true`

- 详情:

配置代码块行号。

- 布尔值 `boolean` 代表是否启用代码块行号。
- 数字 `number` 代表显示行号所需的最少行数。例如,如果你将它设置为 `4` ,那么只有在你的代码块包含至少 4 行代码时才会启用行号。

- 参考:
- [指南 > Markdown > 语法扩展 > 代码块 > 行号](../guide/markdown.md#行号)

#### markdown.code.preWrapper

- 类型: `boolean`

- 默认值: `true`

- 详情:

是否在 `<pre>` 标签外额外包裹一层。

`highlightLines``lineNumbers` 依赖于这个额外的包裹层。这换句话说,如果你禁用了 `preWrapper` ,那么行高亮和行号也会被同时禁用。

::: tip
如果你想要在客户端来实现这些功能时,可以禁用该配置项。比如使用 [Prismjs Line Highlight](https://prismjs.com/plugins/line-highlight/) 或者 [Prismjs Line Numbers](https://prismjs.com/plugins/line-numbers/)
:::

#### markdown.code.vPre.block

- 类型: `boolean`

- 默认值: `true`

- 详情:

是否在代码块的 `<pre>` 标签上添加 `v-pre` 指令。

- 参考:
- [指南 > Markdown > 语法扩展 > 代码块 > 添加 v-pre](../guide/markdown.md#添加-v-pre)

#### markdown.code.vPre.inline

- 类型: `boolean`

- 默认值: `true`

- 详情:

是否在行内代码的 `<code>` 标签上添加 `v-pre` 指令。

- 参考:
- [指南 > Markdown > 语法扩展 > 代码块 > 添加 v-pre](../guide/markdown.md#添加-v-pre)

### markdown.component

- 类型: `undefined | false`
Expand Down Expand Up @@ -674,6 +590,32 @@ const defaultOptions = {
- 参考:
- [指南 > Markdown > 语法扩展 > 目录](../guide/markdown.md#目录)

#### markdown.vPre.block

- 类型: `boolean`

- 默认值: `true`

- 详情:

是否在代码块的 `<pre>` 标签上添加 `v-pre` 指令。

- 参考:
- [指南 > Markdown > 语法扩展 > 代码块 > 添加 v-pre](../guide/markdown.md#添加-v-pre)

#### markdown.vPre.inline

- 类型: `boolean`

- 默认值: `true`

- 详情:

是否在行内代码的 `<code>` 标签上添加 `v-pre` 指令。

- 参考:
- [指南 > Markdown > 语法扩展 > 代码块 > 添加 v-pre](../guide/markdown.md#添加-v-pre)

## 插件配置

### plugins
Expand Down
Loading

0 comments on commit cdfbc06

Please sign in to comment.