Skip to content
0

文章发布较早,内容可能过时,阅读注意甄别。

自动生成的侧边栏

1.修改 docusaurus.config.js 文件

打开 docusaurus.config.js 文件,并在 themeConfig 中配置 sidebar 的属性。你可以将自动生成的侧边栏配置与可折叠和隐藏功能结合起来。

  • 具体配置如下:
ts
module.exports = {
  themeConfig: {
    docs: {
      sidebar: {
        // 允许隐藏侧边栏
        hideable: true,
        // 启用自动折叠类别
        autoCollapseCategories: true,
      },
    },
    navbar: {
      ...
    },
    // 引用自动生成的侧边栏配置
    // highlight-next-line
    sidebar: require('./sidebars.ts'),
  },
};

2.配置 sidebars.ts 文件

确保你的 sidebars.ts 文件中正确配置了自动生成的侧边栏。例如:

ts
import type { SidebarsConfig } from "@docusaurus/plugin-content-docs";

const sidebars: SidebarsConfig = {
  // highlight-start
  mySidebar: [
    {
      type: "autogenerated",
      dirName: ".",
    },
  ], // 自动生成侧边栏
  // highlight-end
};

module.exports = sidebars;

通过以上配置,你可以实现自动生成侧边栏,并且支持侧边栏的隐藏和类别的自动折叠。这样能够提升用户在导航大量文档时的体验

最近更新