Skip to content

VitePress

VitePress is very suitable for generating document websites. It was founded by the Vue community, and many technical documents in the Vue community are generated using it.

To make Feishu Pages work with VitePress, you need to build the VitePress Sidebar based on docs.json.

See: Sidebar

Configure

You can generate Sidebar in the VitePress configuration file, please put docs.jsonin the VitePress documentation project root directory.

Then modify configuration.vitepress/config.mtsand add:

ts
import { DefaultTheme, defineConfig } from 'vitepress';
const docs = require("../docs.json")
/**
 * Convert feishu-pages's docs.json into VitePress's sidebar config
 * @param docs from `docs.json`
 * @returns
 */
const convertDocsToSidebars = (docs: any) => {
  const sidebars: DefaultTheme.SidebarItem[] = [];
  for (const doc of docs) {
    let sidebar: DefaultTheme.SidebarItem = {
      text: doc.title,
      link: doc.slug,
    };
    if (doc.children.length > 0) {
      sidebar.items = convertDocsToSidebars(doc.children);
    }
    sidebars.push(sidebar);
  }

  return sidebars;
};


export default defineConfig({
  ignoreDeadLinks: true,
  themeConfig: {
    sidebar: convertDocsToSidebars(docs),
  },
});

Please copy the .md file in the dist directory generated by feishu-pages to the VitePress docs directory.