快速入門

Using an AI agent?

Copy the instructions into your agent (Claude Code, Cursor, Codex, etc.) to set up a new docs site, or to add Fumadocs to an existing app. For other tasks, give it fumadocs.dev/llms.txt, which lists every docs page as Markdown.

術語

Markdown/MDX： Markdown 是一種用來撰寫格式化文字的標記語言。Fumadocs 原生支援 Markdown 與 MDX (Markdown 的超集) 。

Bun： 一種 JavaScript 執行階段，本指南會使用它來執行指令碼。如果您偏好 Node.js，可以改用 unrun。

若想進一步自訂，具備一些 React.js 基礎知識會很有幫助。

自動安裝

需要 Node.js 22 或以上版本。

npm create fumadocs-app

系統會詢問您要使用哪一個內建範本：

框架：Next.js、React Router、TanStack Start、Waku 和 Astro。
內容來源：Fumadocs MDX 或 Astro 內容集合。

接著會初始化一個新的 Fumadocs 應用程式，並預設設定好以下功能：

LLM 整合。
動態中繼資料圖片。

要從現有的程式碼庫開始？

您可以參考手動安裝指南來開始使用。

開始享受吧！

請在 docs 資料夾中建立您的第一個 MDX 檔案。

content/docs/index.mdx

---
title: Hello World
---

## Yo what's up

以開發模式執行應用程式：

npm run dev

開啟 http://localhost:3000/docs 即可查看您的頁面。

常見問題

以下整理了您可能會遇到的一些常見問題。

路由由 TanStack Start 處理。請先移動文件路由 (/docs/* -> /info/*) 。

將 src/routes/docs/$.tsx 移至 src/routes/info/$.tsx。

最後，請在 source.ts 中更新頁面的基礎 URL：

lib/source.ts

import { loader } from 'fumadocs-core/source';

export const source = loader({
  baseUrl: '/info', // 改成新的路徑
});

範本在 lib/shared.ts 中將此值定義為 docsRoute，請在該處修改，Markdown 連結便會隨之更新。

Vite 的預先打包 (pre-bundling) 有一些奇怪的問題：#3910。請務必將 Fumadocs 排除在預先打包之外，並將其加入 noExternal：

vite.config.ts

import { defineConfig } from 'vite';

export default defineConfig({
  resolve: {
    // 視需要加入其他 Fumadocs 相依套件
    noExternal: ['fumadocs-core', 'fumadocs-ui', 'fumadocs-openapi', '@fumadocs/base-ui'],
  },
});