AI | Fumadocs

Docs for LLM

You can make your docs site more AI-friendly with dedicated docs content for large language models.

First, make a getLLMText function that converts pages into static MDX content:

import { remark } from 'remark';
import remarkGfm from 'remark-gfm';
import remarkMdx from 'remark-mdx';
import { remarkInclude } from 'fumadocs-mdx/config';
import { source } from '@/lib/source';
import type { InferPageType } from 'fumadocs-core/source';

const processor = remark()
  .use(remarkMdx)
  // needed for Fumadocs MDX
  .use(remarkInclude)
  .use(remarkGfm);

export async function getLLMText(page: InferPageType<typeof source>) {
  const processed = await processor.process({
    path: page.data._file.absolutePath,
    value: page.data.content,
  });

  return `# ${page.data.title}
URL: ${page.url}

${page.data.description}

${processed.value}`;
}

Modify it to include other remark plugins.

`llms.txt`

A version of docs for AIs to read.

app/llms.txt/route.ts

import { source } from '@/lib/source';
import { getLLMText } from './get-llm-text';

// cached forever
export const revalidate = false;

export async function GET() {
  const scan = source.getPages().map(getLLMText);
  const scanned = await Promise.all(scan);

  return new Response(scanned.join('\n\n'));
}

`*.mdx`

Allow people to append .mdx to a page to get its Markdown/MDX content.

Make a route handler to return page content.

app/llms.mdx/[[...slug]]/route.ts

import { type NextRequest, NextResponse } from 'next/server';
import { getLLMText } from '@/lib/get-llm-text';
import { source } from '@/lib/source';
import { notFound } from 'next/navigation';

export const revalidate = false;

export async function GET(
  _req: NextRequest,
  { params }: { params: Promise<{ slug?: string[] }> },
) {
  const { slug } = await params;
  const page = source.getPage(slug);
  if (!page) notFound();

  return new NextResponse(await getLLMText(page));
}

export function generateStaticParams() {
  return source.generateParams();
}

And redirect users to that route.

next.config.ts

import type { NextConfig } from 'next';

const config: NextConfig = {
  async rewrites() {
    return [
      {
        source: '/docs/:path*.mdx',
        destination: '/llms.mdx/:path*',
      },
    ];
  },
};

AI Search

You can install the AI search dialog using Fumadocs CLI:

npx @fumadocs/cli add

pnpm dlx @fumadocs/cli add

yarn dlx @fumadocs/cli add

bun x @fumadocs/cli add

By default, it's configured for Inkeep AI. Since it's connected via Vercel AI SDK, you can connect to your own AI models easily.

Note that Fumadocs doesn't provide the AI model, it's up to you.

AI

Docs for LLM

llms.txt

*.mdx

AI Search

On this page

`llms.txt`

`*.mdx`