vuepress-----4、侧边栏

# 4、侧边栏

# 自动生成侧栏

如果你希望自动生成一个仅仅包含了当前页面标题(headers)链接的侧边栏,你可以通过 YAML front matter 来实现:

复制代码
---
sidebar: auto
---

你也可以通过配置来在所有页面中启用它:

复制代码
// .vuepress/config.js
module.exports = {
  themeConfig: {
    sidebar: 'auto'
  }
}

多语言 (opens new window) 模式下, 你也可以将其应用到某一特定的语言下:

复制代码
// .vuepress/config.js
module.exports = {
  themeConfig: {
     '/zh/': {
       sidebar: 'auto'
     }
  }
}

home页面中的home: true会抑制侧边栏的生成

# 侧边栏分组

记得关闭自动生成侧边栏的功能

复制代码
sidebar: [
    '/',
    ['/about/','关于我'],
    ['/about.html', '关于我的HTML'],
    ['/about/','关于我'],
]

# 数组形式:分组侧边栏

复制代码
sidebar: [
    '/',
    '/about/',
    {
        title: '美丽的 CSS',
        path: '/css/',
        collapsable: false, // 可选的, 默认值是 true,
        sidebarDepth: 1,    // 可选的, 默认值是 1
        children: [
            '/css/c-aaa',
            '/css/c-bbb',
            '/css/c-ccc',
        ]
    }
]

# 对象形式:

复制代码
sidebar: {
    "/css/": [
        'c-aaa',
        'c-bbb',
        'c-ccc',
    ],
        "/javascript/": [
            'j-aaa',
            'j-bbb',
            'j-ccc',
        ]
}

视频作者开发插件 (opens new window)

作者博客 (opens new window)

相关推荐
kingmax5421200815 小时前
概率与数理统计公式及结论汇总
人工智能·机器学习·概率论
mit6.82415 小时前
[网络入侵AI检测] docs | 任务二分类与多分类
python
Niuguangshuo15 小时前
深度学习:Dropout 技术
人工智能·深度学习
LLM精进之路15 小时前
美团发布 | LongCat-Flash最全解读,硬刚GPT-4.1、Kimi!
人工智能·深度学习·机器学习·语言模型·transformer
智慧地球(AI·Earth)15 小时前
开源 + 免费!谷歌推出 Gemini CLI,Claude Code 的强劲对手
人工智能·语言模型·开源
mit6.82416 小时前
[Upscayl图像增强] docs | 前端 | Electron工具(web->app)
前端·人工智能·electron·状态模式
DatGuy16 小时前
Week 15: 深度学习补遗:集成学习初步
人工智能·深度学习·集成学习
Source.Liu16 小时前
【Python自动化】 21.2 Pandas 读取 Excel 时的 dtype 参数完全指南
python·自动化·pandas
MYZR116 小时前
智能家居芯片:技术核心与创新突破
人工智能·智能家居
天上的光16 小时前
3.python——数据类型转换
python