Formion LogoMkSaaS文檔
Formion 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>;
}

文件

在文檔中顯示文件結構

可縮放圖片

在文檔中允許放大圖片

目錄

使用方法