3.9 KiB
| title | head | ||||||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
| 主题配置 |
|
{{ $frontmatter.title }}
主题的配置要写在 .vitepress/config.ts 文件中的 themeConfig 属性中
下面是一些简要的配置项一览：
其中 head、sidebar、nav 对应的分别是 页面head脚本、侧边栏菜单、头部导航栏(都可以默认为[])
以下是版本号满足 vitepress >= 1.0.0 vuetom-theme >= 2.3.0 的配置
// .vitepress/config.ts
// import ...
export default defineConfigWithTheme<VuetomThemeConfig>({
base: `/vt/`,
ignoreDeadLinks: true,
lastUpdated: true,
head,
locales: locales.vitepressConfig,
themeConfig: {
nav,
sidebar,
localeLinks: {
text: '',
items: [
{
text: '中文',
link: '/lang/zhcn'
},
{
text: 'English',
link: '/lang/enus'
}
]
},
socialLinks: [
{ icon: 'github', link: pkg.repository }
],
footer: {
message: 'Released under the MIT License.',
copyright: 'Copyright © 2021-present Lauset'
},
algolia: {
appId: '8Q3CNX0EF2',
apiKey: 'd44e3c8ec76aff9c758ef34f2cefe24d',
indexName: 'dev_vuetom'
},
logoImg: '/logo/vuetom-logo-m.png',
bgImg: '/imgs/homg-bg01.jpg',
bgColor: '0,0,0',
bgOpacity: 0.6,
flashEnable: true,
flashColor: ['238,17,17', '0,98,255'],
parallaxEnable: true,
pageBgEnable: true,
pageBgOpacity: 0.8,
featuresColor: ['#06cdff30', 'rgba(223,7,107,.3)']
},
markdown: {
lineNumbers: true
},
appearance: true,
vite: {
ssr: {
noExternal: ["vitepress-theme-vuetom"]
}
}
})
:::warning 注意 需要将主题配置成防止被 SSR 外部化的依赖项
vite: {
ssr: {
noExternal: ["vitepress-theme-vuetom"]
}
}
:::
:::danger 过期提示 vitepress-theme-vuetom 1.x 版本已弃用
请升级版本 vitepress>=1.0 vitepress-theme-vuetom>=2.3.0
:::
以下是对配置项的简要说明
首页LOGO
logoImg
- 类型：
string - 默认值：
''
首页上方LOGO，路径中的首个 / 表示 public 目录
例如：'/logo/homg-logo.jpg'
首页背景图
bgImg
- 类型：
string - 默认值：
undefined
首页全屏背景图，路径中的首个 / 表示 public 目录
例如：'/imgs/homg-bg01.jpg' 等同于 /public/imgs/home-bg01.jpg
bgColor
- 类型：
string - 默认值：
'0,0,0'
背景图边缘的覆盖颜色，值是 rgb 的颜色值 rgb(0,0,0) 则写为 '0,0,0'，默认为黑色
bgOpacity
- 类型：
0 - 1 - 默认值：
0.6
覆盖颜色的透明度，搭配上面的覆盖颜色使用，图片中间透明度要比图片边缘透明度要小
图片中间透明度为 当前bgOpacity - 0.3，也就是说默认为 0.3
文章页背景图
注意：文章页背景图片与首页一致
pageBgEnable
- 类型：
boolean - 默认值：
true
文章页面背景图是否开启，默认开启
pageBgOpacity
- 类型：
0 - 1 - 默认值：
0.8
文章页背景图透明度，1将看不到背景图，0能清晰看到背景图
featuresColor
- 类型：
string | Array - 默认值：
rgba(255,255,255,0.8)
首页功能面板背景色，可以是单个颜色字符串，也可以是两个字符串组成的数组
flashEnable
- 类型：
boolean - 默认值：
false
是否开启首页背景图闪烁功能，效果类似于朋克风故障
flashColor
- 类型：
string | Array - 默认值：
['0,0,0','0,0,0']
首页背景闪烁时附加的色彩，0: Top位置的颜色，1: Right位置的颜色，默认都是黑色
parallaxEnable
- 类型：
boolean - 默认值：
false
是否开启首页部分元素视觉差效果
博客配置项
博客开发中...