Skip to content

配置简介 推荐

提示

Teek 内置了大量的主题配置,但不会影响 vitepress 原来的配置,两者是独立生效的。

主题的配置通常添加在 .vitepress/config.mts文件中。

如下是一份简单的模板:

ts
import{defineConfig } from"vitepress";import{defineTeekConfig } from"vitepress-theme-teek/config";constteekConfig=defineTeekConfig({});exportdefaultdefineConfig({extends:teekConfig,});

在 VitePress 配置中通过 extends可以将主题配置合并到 VitePress 配置里,也就是说完全可以在主题配置里添加 VitePress 的 themeConfig配置项,但是不能反过来,如:

ts
import{defineConfig } from"vitepress";import{defineTeekConfig } from"vitepress-theme-teek/config";constteekConfig=defineTeekConfig({teekTheme:true,});exportdefaultdefineConfig({extends:teekConfig,themeConfig:{logo:"/teek-logo-mini.svg",},});
ts
import{defineConfig } from"vitepress";import{defineTeekConfig } from"vitepress-theme-teek/config";constteekConfig=defineTeekConfig({teekTheme:true,logo:"/teek-logo-mini.svg",});exportdefaultdefineConfig({extends:teekConfig,});

Teek 的所有主题配置支持 4 种方式:

  1. provide:在 .vitepress/theme/index.ts通过 provide 函数注入配置项
  2. frontmatter.tk:在 Markdown 文档的 frontmatter配置
  3. frontmatter:在 Markdown 文档的 frontmatter配置
  4. config:在 .vitepress/config.mts配置

警告

函数式和 Node 环境的配置项无法在 frontmatter中配置。

优先级依次从高到低排列,如 frontmatter的配置会覆盖 config的配置,因此您可以在 config全局配置,然后在部分 Markdown 文档的 frontmatter进行局部配置覆盖。

frontmatter.tkfrontmatter配置的区别

  • frontmatter.tk建议在首页 index.md配置,目的是为防止和 VitePress 的冲突,而文章页建议使用 frontmatter配置。
  • 如果部分配置项与第三方插件的配置有冲突,也可以使用 frontmatter.tk配置。

举个例子:

ts
importTeek,{teekConfigContext } from"vitepress-theme-teek";import"vitepress-theme-teek/index.css";import{defineComponent,h,provide } from"vue";exportdefault{extends:Teek,Layout:defineComponent({name:"TeekProvider",setup() {provide(teekConfigContext,{author:{name:"Teeker"} });return() =>h(Teek.Layout);},}),};
yaml
---tk:author:name:Teeker---
yaml
---author:name:Teeker---
ts
import{defineConfig } from"vitepress";import{defineTeekConfig } from"vitepress-theme-teek/config";constteekConfig=defineTeekConfig({author:{name:"Teeker",},});exportdefaultdefineConfig({extends:teekConfig,});

Teek 支持的主题配置请阅读 Types文件。

最近更新