ワンクリックで
fumadocs-cli
// Create and configure Fumadocs projects using CLI, selecting frameworks, content sources, and UI components
// Create and configure Fumadocs projects using CLI, selecting frameworks, content sources, and UI components
Build and deploy Fumadocs documentation sites, supporting static export, PDF, RSS, and more
Build documentation sites using Headless components library, including navigation, TOC, search API, and content collections
Configure internationalization support for Fumadocs, including multi-language routing and content organization
Configure and manage Fumadocs MDX content collections, including schema definition, type generation, and file imports
Configure and integrate document search engines for Fumadocs, supporting Orama, Algolia, Mixedbread, and other solutions
Customize documentation appearance and layouts using Fumadocs UI theme and component library
| name | Fumadocs CLI |
| description | Create and configure Fumadocs projects using CLI, selecting frameworks, content sources, and UI components |
Fumadocs CLI is a command-line tool for creating and managing Fumadocs projects.
Supports npm, pnpm, yarn, bun:
npm create fumadocs-app
Add dependencies based on your chosen framework:
npm install fumadocs-ui fumadocs-mdx fumadocs-core
npm install fumadocs-nextjs-ui
npm install fumadocs-ui fumadocs-mdx fumadocs-core
npm install fumadocs-react-router-ui
npm install fumadocs-ui fumadocs-mdx fumadocs-core
npm install fumadocs-tanstack-start-ui
npm install fumadocs-ui fumadocs-mdx fumadocs-core
npm install fumadocs-waku-ui
Create fumadocs-mdx.config.ts or source.config.ts:
import { defineDocs } from 'fumadocs-mdx/config';
import { z } from 'zod';
export const docs = defineDocs({
dir: 'content/docs',
docs: {
schema: pageSchema.extend({
index: z.boolean().default(false),
tags: z.array(z.string()).default([]),
}),
},
meta: {
schema: metaSchema.extend({
title: z.string(),
description: z.string(),
}),
},
});
View documentation: https://www.fumadocs.dev/docs/integrations/content
npx @fumadocs/cli@latest customise
Install based on your needs:
npm install fumadocs-ui @fumadocs/base-ui
Radix UI (default): Full accessibility support
Base UI: Lightweight alternative
Configure in cli.json:
{
"uiLibrary": "base-ui"
}
In layout.tsx:
import { DocsLayout } from 'fumadocs-ui/layouts/docs';
import { source } from '@/lib/source';
export default function Layout({ children }: { children: React.ReactNode }) {
return (
<DocsLayout tree={source.getPageTree()}>
{children}
</DocsLayout>
);
}
import { DocsLayout } from 'fumadocs-ui/layouts/docs';
<DocsLayout
tree={source.getPageTree()}
sidebar={{
enabled: true,
tabs: true,
}}
>
{children}
</DocslocLayout>
Modify the docs route configuration in next.config.js or vite.config.ts.
Configure multiple content directories or use nested structure.
Enable to support static website deployment.
Reference Documentation: