docsify配置侧边栏

Laughing
2022-09-28 / 0 评论 / 2,050 阅读 / 搜一下 / 正在检测是否收录...

docsify配置完成后,默认显示的是README.md的内容,侧边栏显示的就是README.md的目录。

比如我的README.md配置

# 李森的博客

> https://lisen.cc

# 我是一级目录

## 我是二级目录

但是我们的在线文档一般不会只有一个文件,我们更多的是像文件夹层级一样,按照文件夹的目录展示我们的文档,所以,我们可以将MarkDown文件,然后所在文件夹级次进行展示。

配置docsify

index.html中配置docsify,支持侧边栏。

    window.$docsify = {
      name: '',
      repo: '',
      //启用封面支持
      coverpage:true,
      // 侧边栏支持,默认加载的是项目根目录下的_sidebar.md文件
      loadSidebar: true,
       // 最大支持渲染的标题层级
       maxLevel: 5,
      // 自定义侧边栏后默认不会再生成目录,设置生成目录的最大层级(建议配置为2-4)
      subMaxLevel: 4,
    }

添加侧边栏配置文件

如果只配置上面,启用侧边栏支持,你会发现左侧侧边栏没有了,此时,我们需要添加一个侧边栏配置文件_sidebar.md

在根目录下创建文件_sidebar.md

_sidebar.md中配置文件目录

* 我是一级目录一
  * [我是二级目录1.1](/文章/我是一级目录一/我是二级目录1.1.md) <!--注意这里是相对路径-->
  * [我是二级目录1.1](/文章/我是一级目录一/我是二级目录1.2.md)
* 我是一级目录二
  * [我是二级目录2.1](/文章/我是一级目录二/我是二级目录2.1.md)

然后根据我们_sidebar.md中配置的目录,创建对应文件或文件夹

配置完成后,再次预览我们的网站

2

评论 (0)

取消