vuepress-theme-plume/docs/notes/theme/guide/代码/代码组.md

title, author, icon, createTime, permalink

title	author	icon	createTime	permalink
代码组	pengzhanbo	fluent:group-list-20-filled	2024/04/04 10:36:59	/guide/code/group/

语法

可以像这样对多个代码块进行分组：

输入：

::: code-tabs
@tab config.js
```js
/**
 * @type {import('vuepress').UserConfig}
 */
const config = {
  // ..
}

export default config
```

@tab config.ts
```ts
import type { UserConfig } from 'vuepress'

const config: UserConfig = {
  // ..
}

export default config
```
:::

输出：

::: code-tabs @tab config.js

/**
 * @type {import('vuepress').UserConfig}
 */
const config = {
  // ..
}

export default config

@tab config.ts

import type { UserConfig } from 'vuepress'

const config: UserConfig = {
  // ..
}

export default config

:::

你还可以通过 @tab:active 选择其中一个代码块作为默认显示的代码块。