LogoMkSaaS文档
    LogoMkSaaS文档
    首页

    介绍

    快速入门什么是 Fumadocs对比

    设置

    手动安装静态导出

    写作

    Markdown国际化

    UI

    概览主题搜索
    组件
    手风琴横幅代码块(动态)文件GitHub 信息可缩放图片内联目录根切换器步骤选项卡类型表格
    MDX
    X (Twitter)
    组件

    GitHub 信息

    显示您的 GitHub 仓库信息

    使用方法

    import { GithubInfo } from 'fumadocs-ui/components/github-info';
    
    <GithubInfo
      owner="fuma-nama"
      repo="fumadocs"
      // 您自己的 GitHub 访问令牌(可选)
      token={process.env.GITHUB_TOKEN}
    />;

    建议将其添加到您的文档布局中,使用 links 选项:

    app/docs/layout.tsx
    import { DocsLayout, type DocsLayoutProps } from 'fumadocs-ui/layouts/notebook';
    import type { ReactNode } from 'react';
    import { baseOptions } from '@/app/layout.config';
    import { source } from '@/lib/source';
    import { GithubInfo } from 'fumadocs-ui/components/github-info';
    
    const docsOptions: DocsLayoutProps = {
      ...baseOptions,
      tree: source.pageTree,
      links: [
        {
          type: 'custom',
          children: (
            <GithubInfo owner="fuma-nama" repo="fumadocs" className="lg:-mx-2" />
          ),
        },
      ],
    };
    
    export default function Layout({ children }: { children: ReactNode }) {
      return <DocsLayout {...docsOptions}>{children}</DocsLayout>;
    }

    文件

    在文档中显示文件结构

    可缩放图片

    在文档中允许放大图片

    目录

    使用方法