Menu System

Kecare offers a unified menu configuration method for generating side navigation bars.

Creating a Menu

Menu files are stored in the .kecare/menus/ directory, with the naming format <name>.menu.source.ts:

// .kecare/menus/kecare-docs.menu.source.ts
import type { NavItem } from "kecare";

export const navItems: NavItem[] = [
    {
        text: "分组名称",
        level: 1,
        items: [
            { text: "菜单项", link: "./文章路径.md", level: 2 },
        ],
    },
    {
        text: "分组名称2",
        level: 1,
        items: [
            { text: "菜单项2", link: "./文章路径2.md", level: 2 },
        ],
    }
];

The file name prefix (e.g., kecare-docs) is the menu value referenced in the article.

Enabling in Articles

Add the menu field in the Front Matter:

---
title: 快速开始
menu: kecare-docs
---

The menu value corresponds to the prefix of the menu file name: kecare-docskecare-docs.menu.source.ts

type NavItem =
    | { text: string; link: string; level: number; desc?: string; icon?: string }  // 叶子节点
    | { text: string; items: NavItem[]; level: number };                           // 分组节点
  • Leaf Node: Clickable for navigation, link is the article path (e.g., ./quick-start)
  • Group Node: Used for categorization only, contains a items sub-array
文章作者:
文章链接:kecare.me/articles/4ee23999
版权声明: 博客所有文章除特别声明外,均采用 CC BY-NC-SA 4.0 许可协议。转载请注明来源