虽然本主题希望尽可能的少写配置，但还是有些配置是不可省略的，而且也是为了保证一定程度的可定制性。

# 配置文件

Vuepress 默认的配置文件是.vuepress/config.ts，可能你的项目配置如下，

新建.vuepress/config.ts文件进行配置：

├─ {sourceDir}
│  ├─ .vuepress
│  │  └─ config.js
│  └─ README.md
├─ .gitignore
└─ package.json

VuePress 支持的配置，请查阅 官方文档

在 Vuepress@v2中对于主题的配置，引入主题函数，在函数中进行配置

// .vuepress/config.ts
import { defineUserConfig } from 'vuepress'
import { themePlume } from '@vuepress-plume/vuepress-theme-plume'
export default defineUserConfig({
  theme: themePlume({
    // more...
  })
})

// .vuepress/config.js
import { themePlume } from '@vuepress-plume/vuepress-theme-plume'
module.exports = {
  theme: themePlume({
    // more...
  })
}

# 配置

# home

• 类型： false | string
• 默认值： /
• 详情： 首页的路径， 它将被用于：
  • 导航栏中 logo的链接；
  • 404页面的 返回首页 的链接；

# logo

• 类型: false | string
• 默认值： false
• 详情： 导航栏中的logo。

# logoDark

• 类型 false | string
• 默认值： false
• 详情： Dark模式下，导航栏中的logo。

# appearance

• 类型： boolean | 'dark'
• 默认值： true
• 详情： 是否启用 dark模式

# hostname

部署站点域名。

用于生成 sitemap、 seo等。

# avatar

• 类型： PlumeThemeAvatar
• 默认值： {}
• 详情：配置站点博主的个人信息
  • avatar.url: 头像地址，用于右侧博主信息展示
  • avatar.name: 名称， 用于右侧博主信息展示
  • avatar.description: 个人描述，用于右侧博主信息展示
• 示例：

  export default {
    theme: themePlume({
      avatar: {
        url: '/avatar.jpg',
        name: '张三',
        description: '此处无银三百两，隔壁王二不曾偷',
      }
    })
  }
  

# social

• 类型： false | SocialLink[]
• 默认值： false
• 详情： 个人社交信息配置。
• 示例：

  export default {
    theme: themePlume({
      social: [{
        icon: 'github',
        link: 'https://github.com/zhangsan',
      }]
    })
  }
  

# blog

• 类型： false | BlogOptions
• 默认值： { dir: './', link: '/blog/', include: ['**/*.md'], exclude: [] }
• 详情： 博客配置

interface BlogOptions {
    /**
     * blog 文章读取目录
     *
     * @default './' 即 vuepress 配置的 source 目录
     */
    dir?: string

    /**
     * blog list link
     *
     * @default '/blog/'
     */
    link?: string

    /**
     * 在 `blog.dir` 目录中，通过 glob string 配置包含文件
     *
     * @default - ['**\*.md']
     */
    include?: string[]

    /**
     * 在 `blog.dir` 目录中，通过 glob string 配置排除的文件
     *
     *  _README.md 文件一般作为主页或者某个目录下的主页，不应该被读取为 blog文章_
     *
     * @default - ['.vuepress/', 'node_modules/', '{README,index}.md']
     */
    exclude?: string[]
  }

# article

• 类型： string
• 默认值： /article/
• 详情： 文章链接前缀

# navbar

• 类型： NavItem[]

• 默认值： []

• 详情： 导航栏配置。

  为了配置导航栏元素，你可以将其设置为 导航栏数组 ，其中的每个元素是 NavItem 对象、

  • NavItem 对象应该有一个 text 字段和一个 link 字段，还有一个可选的 activeMatch 字段。

type NavItem = string | {
  text: string
  link: string
  items: NavItem[]
  /**
   * 支持 iconify 图标，直接使用 iconify name 即可自动加载
   * 
   * @see https://icon-sets.iconify.design/
   */
  icon: string
}

• 示例1：

  module.exports = {
    theme: plumeTheme({
      navbar: [
        // NavbarItem
        {
          text: 'Foo',
          link: '/foo/',
        },
        // NavbarGroup
        {
          text: 'Group',
          item: ['/group/foo/', '/group/bar/'],
        },
        // 字符串 - 页面文件路径
        '/bar/',
      ],
    }),
  }
  
• 示例2：

  module.exports = {
    theme: plumeTheme({
      navbar: [
        // 嵌套 Group - 最大深度为 2
        {
          text: 'Group',
          items: [
            {
              text: 'SubGroup',
              items: ['/group/sub/', '/group/sub/bar/'],
            },
          ],
        },
        // 控制元素何时被激活
        {
          text: 'Group 2',
          items: [
            {
              text: 'Always active',
              link: '/',
              // 该元素将一直处于激活状态
              activeMatch: '/',
            },
            {
              text: 'Active on /foo/',
              link: '/not-foo/',
              // 该元素在当前路由路径是 /foo/ 开头时激活
              // 支持正则表达式
              activeMatch: '^/foo/',
            },
          ],
        },
      ],
    }),
  }
  

# footer

• 类型： false | { message: string; copyright: string }
• 默认值： false
• 详情：页脚配置。

# notes

• 类型： false | PlumeThemeNotesOptions

• 默认值： { link: '/note', dir: 'notes', notes: [] }

• 详情： 笔记配置， 笔记中的文章默认不会出现在首页文章列表

  你可以将配置的notes 配置到 navbar中，以便浏览查看

详细配置请查看 此文档

# selectLanguageName

• 类型： string
• 默认值： ''
• 详情： 多语言配置中的选择语言名称。将会出现在 navbar 语言选择菜单中。

# locales

多语言配置，参考 此文档

# themePlugins

• 类型：PlumeThemePluginOptions

• 默认值： {}

• 详情： 对主题内使用的插件进行自定义配置。

  主题使用的插件默认已进行了配置，默认情况下不需要进行修改，如果需要使用到细致的定制化，请查阅 此文档

# 完整示例

import { defineUserConfig } from 'vuepress'
import { plumeTheme } from '@vuepress-plume/vuepress-theme-plume'

export default defineUserConfig({
  lang: 'zh-CN',
  locales: {
    '/': {
      lang: 'zh-CN',
      title: 'Theme Plume',
      description: 'The Theme for VuePress 2',
    },
  },
  dest: 'docs',
  head: [
    ['link', { rel: 'icon', href: '/g.gif' }],
    ['meta', { 'http-equiv': 'X-UA-Compatible', content: 'id=edg' }],
  ],
  theme: plumeTheme({
    logo: '/g.gif',
    darkMode: true,
    avatar: {
      name: 'theme plume',
      url: '/images/blogger.png',
      description: 'good good study, day day up !'
    },
    social: [{
      icon: 'github',
      link: 'https://github.com/me',
    }],
    navbar: [{ text: 'Theme-Plume', link: '/note/vuepress-theme-plume' }],
    notes: {
      dir: 'notes',
      link: '/note',
    },
    footer: {
      copyright: 'Copyright © 2022-yanyunnn',
      message: '',
    },
  }),
})

import { plumeTheme } from '@vuepress-plume/vuepress-theme-plume'
module.exports = {
  lang: 'zh-CN',
  locales: {
    '/': {
      lang: 'zh-CN',
      title: 'Theme Plume',
      description: 'The Theme for VuePress 2',
    },
  },
  dest: 'docs',
  head: [
    ['link', { rel: 'icon', href: '/g.gif' }],
    ['meta', { 'http-equiv': 'X-UA-Compatible', content: 'id=edg' }],
  ],
  theme: plumeTheme({
    logo: '/g.gif',
    darkMode: true,
    avatar: {
      name: 'theme plume',
      url: '/images/blogger.jpg',
      description: 'good good study, day day up !'
    },
    social: [{
      icon: 'github',
      link: 'https://github.com/me',
    }],
    navbar: [{ text: 'Theme-Plume', link: '/note/vuepress-theme-plume' }],
    notes: {
      dir: 'notes',
      link: '/note',
    },
    footer: {
      copyright: 'Copyright © 2022-yanyunnn',
      message: '',
    },
  }),
}