VuePress 侧边栏使用详解

最新推荐文章于 2026-05-11 14:31:58 发布

原创

最新推荐文章于 2026-05-11 14:31:58 发布 · 1.3w 阅读

收录于

当前文章被以下社区和专栏收录：

本文详细介绍了Markdown侧边栏的配置方法，包括基本设置、分组及显示文件名的技巧。通过实例展示了如何创建和组织侧边栏，以及如何在不改变Markdown文件内容的情况下显示自定义名称。文章提供了多种实现方式，并推荐了最佳实践。

前言

官网写的侧边栏教程真的是让人很糟心，经过一番摸索，总算大致弄清楚了，下面详细说一下用法：

目录结构：

docs根目录下有一个README.md、chinese文件夹、english文件夹

最简侧边栏：

sidebar: {
            '/language/chinese/': [
                '',  //该目录下的README.md文件
                'a', //该目录下的a.md文件
                'b'  //该目录下的a.md文件
            ],

            '/language/english/': [
                '',
            ],
        },

chinese文件夹下的侧边栏：