---
title: 主题插件配置
createTime: 2022/05/14 10:43:53
author: pengzhanbo
permalink: /note/vuepress-theme-plume/plugins-config/
---

主题内置的使用的插件，扩展了主题的众多功能，你可以在这个 字段中， 实现对内部使用的各个插件的自定义配置。

## 配置
所有主题内部使用的插件， 均在 `themePlugins` 字段中进行配置。
``` js {4-6}
import { themePlume } from '@vuepress-plume/vuepress-theme-plume'
module.exports = {
  theme: themePlume({
    themePlugins: {
      // this
    }
  })
}
```

## 配置字段

### caniuse

关联插件： [@vuepress-plume/vuepress-plugin-caniuse](https://www.npmjs.com/package/@vuepress-plume/vuepress-plugin-caniuse)

- 类型： `false | CanIUsePluginOptions`
- 默认值： `{ mode: 'embed' }`
- 详情：该插件支持在你的文章中嵌入 [can I use](https://caniuse.com/) 特性支持图表。
  
  设置为 `false` 表示不启动该插件。
  - `caniuse.mode`: 图表嵌入模式， `embed`表示嵌入可交互式的图表， `image` 嵌入动态图片。
- 配置示例：
  ``` js
  module.exports = {
    theme: themePlume({
      themePlugins: {
        caniuse: {
          mode: 'embed'
        },
      },
    }),
  }
  ```

### externalLinkIcon

关联插件： [@vuepress/plugin-external-link-icon](https://v2.vuepress.vuejs.org/zh/reference/plugin/external-link-icon.html)

- 类型： `false | string`
- 默认值： `''`
- 详情： 该插件会为你 Markdown 内容中的外部链接添加一个图标，即 <ExternalLinkIcon />
  
  一般来说你不需要对它进行配置

### search

网站内容搜索插件

关联插件： [@vuepress/plugin-search](https://v2.vuepress.vuejs.org/zh/reference/plugin/search.html)

详细介绍与配置，请查阅 [官方文档](https://v2.vuepress.vuejs.org/zh/reference/plugin/search.html)

- 默认配置： `''`

### docsearch

使用 [Algolia DocSearch](https://docsearch.algolia.com/) 提供支持的网站内容搜索插件

关联插件：[@vuepress/plugin-docsearch](https://v2.vuepress.vuejs.org/zh/reference/plugin/docsearch.html)

详细介绍与配置，请查阅  [官方文档](https://v2.vuepress.vuejs.org/zh/reference/plugin/docsearch.html)

- 默认配置： `''`

::: info 提示
请勿 同时配置 `search` 和 `docsearch` ，两者的功能是类似的，且同时配置仅会使用优先使用 `search`。
:::

### prismjs

代码块语法高亮插件

关联插件： [@vuepress/plugin-prismjs](https://v2.vuepress.vuejs.org/zh/reference/plugin/prismjs.html)

详细介绍与配置，请查阅 [官方文档](https://v2.vuepress.vuejs.org/zh/reference/plugin/prismjs.html)

### nprogress

页面切换时展示进度条。

关联插件： [@vuepress/plugin-nprogress](https://v2.vuepress.vuejs.org/zh/reference/plugin/nprogress.html)

详细介绍与配置，请查阅 [官方文档](https://v2.vuepress.vuejs.org/zh/reference/plugin/nprogress.html)

### copyCode

代码拷贝插件

支持在代码块中进行代码复制

关联插件：[vuepress-plugin-copy-code2](https://vuepress-theme-hope.github.io/v2/copy-code/)

详细介绍与配置，请查阅[官方文档](https://vuepress-theme-hope.github.io/v2/copy-code/)

- 默认配置： 
  ``` js
  module.exports = {
    theme: themePlume({
      themePlugins: {
        copyCode: {
          selector: '.page-content div[class*="language-"] pre',
          locales: {
            '/': {
              copy: '复制成功',
              hint: '复制代码',
            },
          },
        },
      },
    }),
  }
  ```

### markdownEnhance

`Markdown` 功能扩展插件

关联插件：[vuepress-plugin-md-enhance](https://vuepress-theme-hope.github.io/v2/md-enhance/zh/)

扩展支持：自定义容器、代码块分组、上下角标、自定义对齐、脚注、标记、任务列表、chart、流程图、代码演示 等功能。

相关介绍及配置，请查阅 [官方文档](https://vuepress-theme-hope.github.io/v2/md-enhance/zh/)

- 默认配置：
  ``` js
  module.exports = {
    theme: themePlume({
      themePlugins: {
        markdownEnhance: {
          container: true, // 自定义容器 info note tip warning danger details
          codegroup: true, // 代码块分组
          align: true, // 自定义对齐
          mark: true, // 标记
          tasklist: true, // 任务列表
          demo: true, // 代码演示
        }
      }
    })
  }
  ```
### comment

评论插件

关联插件： [vuepress-plugin-comment2](https://vuepress-theme-hope.github.io/v2/comment/zh/)

支持使用 `giscus`、`twikoo`、`waline` 启用评论功能。

相关介绍及配置，请查阅 [官方文档](https://vuepress-theme-hope.github.io/v2/comment/zh/)

- 默认配置：`''`
