自定义容器

插件可以为你添加提示、注释、信息、注意、警告和详情自定义容器的支持。

配置

TS

// .vuepress/config.ts
import { mdEnhancePlugin } from "vuepress-plugin-md-enhance";

export default {
  plugins: [
    mdEnhancePlugin({
      // 启用自定义容器
      container: true,
    }),
  ],
};

JS

// .vuepress/config.js
import { mdEnhancePlugin } from "vuepress-plugin-md-enhance";

export default {
  plugins: [
    mdEnhancePlugin({
      // 启用自定义容器
      container: true,
    }),
  ],
};

演示

默认标题的容器

相关信息

信息容器。

注

注释容器。

提示

提示容器

注意

警告容器

警告

危险容器

详情

详情容器

::: info
信息容器。
:::

::: note
注释容器。
:::

::: tip
提示容器
:::

::: warning
警告容器
:::

::: danger
危险容器
:::

::: details
详情容器
:::

自定义标题的容器

自定义标题

一个有 代码 和 链接 的信息容器。

const a = 1;

自定义标题

一个有 代码 和 链接 的注释容器。

const a = 1;

自定义标题

一个有 代码 和 链接 的提示容器。

const a = 1;

自定义标题

一个有 代码 和 链接 的警告容器。

const a = 1;

自定义标题

一个有 代码 和 链接 的危险容器。

const a = 1;

自定义标题

一个有 代码 和 链接 的详情容器。

const a = 1;

::: info 自定义标题

一个有 `代码` 和 [链接](#演示) 的信息容器。

```js
const a = 1;
```

:::

::: note 自定义标题

一个有 `代码` 和 [链接](#演示) 的注释容器。

```js
const a = 1;
```

:::

::: tip 自定义标题

一个有 `代码` 和 [链接](#演示) 的提示容器。

```js
const a = 1;
```

:::

::: warning 自定义标题

一个有 `代码` 和 [链接](#演示) 的警告容器。

```js
const a = 1;
```

:::

::: danger 自定义标题

一个有 `代码` 和 [链接](#演示) 的危险容器。

```js
const a = 1;
```

:::

::: details 自定义标题

一个有 `代码` 和 [链接](#演示) 的详情容器。

```js
const a = 1;
```

:::

不含内容的容器

自定义信息

自定义注释

自定义提示

自定义警告

自定义危险

::: info 自定义信息
:::

::: note 自定义注释
:::

::: tip 自定义提示
:::

::: warning 自定义警告
:::

::: danger 自定义危险
:::