
快速入門
Fumadocs 入門指南
簡介
Fumadocs (Foo-ma docs) 是一個基於 Next.js 的文檔框架,設計為快速、靈活, 並無縫集成到 Next.js App Router 中。
Fumadocs 由不同部分組成:
Fumadocs Core
處理大部分邏輯,包括文檔搜尋、內容源適配器和 Markdown 擴展。
Fumadocs UI
Fumadocs 的預設主題為文檔站點提供了美觀的外觀和交互式組件。
Content Source
您內容的來源,可以是 CMS 或本地數據層,如 Content Collections 和 Fumadocs MDX,即官方內容源。
Fumadocs CLI
一個命令行工具,用於安裝 UI 組件和自動化操作,對於自定義佈局非常有用。
想了解更多?
閱讀我們深入的 什麼是 Fumadocs 介紹。
術語
Markdown/MDX: Markdown 是一種用於創建格式化文本的標記語言。Fumadocs 預設支持 Markdown 和 MDX(Markdown 的超集)。
雖然不是必需的,但對 Next.js App Router 的基本瞭解對於進一步的自定義會很有幫助。
自動安裝
需要 Node.js 18 或更高版本,請注意 Node.js 23.1 可能在 Next.js 生產構建中存在問題。
npm create fumadocs-apppnpm create fumadocs-appyarn create fumadocs-appbun create fumadocs-app它會詢問您要使用的框架和內容源,隨後將初始化一個新的 fumadocs 應用程序。現在您可以開始動手了!
從現有代碼庫開始?
您可以按照 手動安裝 指南開始。
盡情使用!
在 docs 資料夾中創建您的第一個 MDX 文件。
---
title: Hello World
---
## Yo what's up在開發模式下運行應用程序並查看 http://localhost:3000/docs。
npm run dev探索
在項目中,您可以看到:
lib/source.ts:內容源適配器的代碼,loader()提供了與內容源交互的接口,併為您的頁面分配 URL。app/layout.config.tsx:佈局的共享選項,可選但建議保留。
| 路由 | 描述 |
|---|---|
app/(home) | 您的登陸頁面和其他頁面的路由組。 |
app/docs | 文檔佈局和頁面。 |
app/api/search/route.ts | 搜尋的路由處理器。 |
編寫內容
對於編寫文檔,請務必閱讀:
內容源
內容源處理您的所有內容,例如編譯 Markdown 文件和驗證前言。
閱讀 介紹 瞭解它如何處理您的內容。
項目中已包含 source.config.ts 配置文件,您可以自定義不同的選項,如前言模式。
Fumadocs 不僅限於 Markdown。對於其他源(如 Sanity),您可以構建 自定義內容源。
自定義 UI
請參閱 自定義指南。
常見問題
您可能遇到的一些常見問題。
瞭解更多
剛來這裡?別擔心,我們歡迎您的問題。
郵件列表
加入我們的社區
訂閱郵件列表,及時獲取最新消息和更新


