跳至主要內容

主题基本选项

大约 4 分钟配置主题配置基础

警告

这些选项很重要,需要你正确配置。

hostname 仅限 Root

  • 类型: string
  • 必填: 是

当前网站部署到的域名。

提示

它应该包含完整协议 (如: https://example.com)。

author

  • 类型: Author

    type AuthorName = string;
    
    interface AuthorInfo {
      /**
       * 作者姓名
       */
      name: string;
    
      /**
       * 作者网站
       */
      url?: string;
    
      /**
       * 作者 Email
       */
      email?: string;
    }
    
    type Author = AuthorName | AuthorName[] | AuthorInfo | AuthorInfo[];
    
  • 必填: 否

文章显示的默认作者

license

  • 类型: string
  • 必填: 否

站点的默认协议

favicon

  • 类型: string
  • 必填: 否

站点图标

  • 类型: NavbarConfig

    interface TextItemOptions {
      /**
       * 项目文字
       */
      text: string;
    
      /**
       * 项目图标
       */
      icon?: string;
    
      /**
       * 项目无障碍标签
       */
      ariaLabel?: string;
    }
    
    interface AutoLinkOptions extends TextItemOptions {
      /**
       * 当前页面链接
       */
      link: string;
    
      /**
       * `<a>` 标签的 `rel` 属性
       */
      rel?: string;
    
      /**
       * `<a>` 标签的 `target` 属性
       */
      target?: string;
    
      /**
       * 匹配激活的正则表达式
       */
      activeMatch?: string;
    }
    
    interface NavGroup<T> extends TextItemOptions {
      /**
       * 当前分组的页面前缀
       */
      prefix?: string;
    
      /**
       * 当前分组的链接
       */
      link?: string;
    
      /**
       * 当前分组的子项
       */
      children: T[];
    }
    
    type NavbarItem = AutoLinkOptions;
    type NavbarGroup = NavGroup<NavbarGroup | NavbarItem | string>;
    type NavbarConfig = (NavbarItem | NavbarGroup | string)[];
    
  • 详情: 布局 → 导航栏

导航栏配置

  • 类型: SidebarConfig

    interface TextItemOptions {
      /**
       * 项目文字
       */
      text: string;
    
      /**
       * 项目图标
       */
      icon?: string;
    
      /**
       * 项目无障碍标签
       */
      ariaLabel?: string;
    }
    
    interface AutoLinkOptions extends TextItemOptions {
      /**
       * 当前页面链接
       */
      link: string;
    
      /**
       * `<a>` 标签的 `rel` 属性
       */
      rel?: string;
    
      /**
       * `<a>` 标签的 `target` 属性
       */
      target?: string;
    
      /**
       * 匹配激活的正则表达式
       */
      activeMatch?: string;
    }
    
    type SidebarPageItem = AutoLinkOptions;
    
    interface SidebarGroupItem extends TextItemOptions {
      /**
       * 当前分组的页面前缀
       */
      prefix?: string;
    
      /**
       * 当前分组的链接
       */
      link?: string;
    
      /**
       * 当前分组的链接是否可折叠
       *
       * @default false
       */
      collapsible?: boolean;
    
      /**
       * 当前分组的子项
       */
      children: (
        | SidebarPageItem
        | SidebarGroupItem
        | SidebarStructureItem
        | string
      )[];
    }
    
    interface SidebarStructureItem extends TextItemOptions {
      /**
       * 当前分组的页面前缀
       */
      prefix?: string;
    
      /**
       * 当前分组的链接
       */
      link?: string;
    
      /**
       * 当前分组的链接是否可折叠
       *
       * @default false
       */
      collapsible?: boolean;
    
      children: "structure";
    }
    
    type SidebarItem =
      | SidebarPageItem
      | SidebarGroupItem
      | SidebarStructureItem
      | string;
    
    type SidebarArrayConfig = SidebarItem[];
    
    type SidebarObjectConfig = Record<
      string,
      SidebarArrayConfig | "structure" | false
    >;
    
    type SidebarConfig = SidebarArrayConfig | SidebarObjectConfig;
    
  • 详情: 布局 → 侧边栏

侧边栏配置

locales 仅限 Root

主题的多语言配置,你可以在这里分别为每个语言设置单独的选项。

extraLocales 仅限 Root

  • 类型: Record<string, string>

站点的额外语言环境,其中键名是语言名称,值是站点路径,:route 将替换为当前路由路径。

hotReload 仅限 Root

  • 类型: boolean
  • 默认值: 是否在使用 --debug 标识

是否需要在开发服务器启用完整功能与热更新。
是否在开发服务器中启用热重载。

提示

通常,你会希望:

  • 开发服务器可以被尽快启动
  • 对项目的修改可以在开发服务器上快速生效,并避免重新启动整个 VuePress 应用程序。

为了达到这个预期,主题需要在开发服务器上的跳过一些耗时操作,并且需要在开发服务器上禁用一些由页面修改触发的耗时功能,以提高项目启动和热更新的速度。同时,由于一些修改会改变 VuePress 的底层原始数据,这些修改会导致网页刷新并重新加载整个 VuePress 应用程序。为了避免在修改 Markdown 时频繁的页面重新加载 (即: 触发页面刷新并且获得几秒钟的白屏),该主题禁用了开发服务器上的某些功能。

默认情况下,开发服务器拥有以下限制:

  • 不启用基于 Git 的功能,包括贡献者、自动创建日期和最后更新时间 (调用 Git 程序以及文件 IO 会导致高耗时)
  • 结构化侧边栏只会在应用启动时生成,后续不会更新 (侧边栏排序和索引取决于每个页面 frontmatter,Markdown 内容的任何变化都会触发重新计算,因此大量页面会导致高耗时)
  • 博客文章、标签、分类和每个分类中的文章列表不会随着开发服务器更新 (Markdown 内容的任何变化都会触发重新计算,所以大量的页面会导致高耗时)
  • 博客文章信息不含阅读时间和字数信息 (Markdown 内容的任何更改都会更改页面字数信息,并因更新了 VuePress 底层原始数据导致页面刷新)

启用它意味着你接受每次修改都会触发一些高耗时计算并且整个应用程序将重新启动,这通常会导致页面刷新,并在在性能较弱的环境中获得数秒白屏。