Skip to main content

​
Introduction

Fumadocs is built on top of modern React frameworks, giving you flexible deployment options ranging from server-side rendering to fully static sites. This guide covers the essential concepts and platform-specific instructions for deploying your documentation.

​
Deployment Models

Fumadocs supports two primary deployment approaches:

​
Server-Side Rendering (SSR)

The default deployment model for Fumadocs applications. Your documentation runs on a Node.js server, enabling:
  • Dynamic content generation
  • Server-side search indexing
  • API routes for advanced features
  • On-demand revalidation
Best for:
  • Large documentation sites with frequent updates
  • Sites requiring server-side logic
  • Teams using Vercel or similar platforms

​
Static Site Generation (SSG)

Export your documentation as static HTML/CSS/JS files for hosting on CDNs:
  • No server required
  • Maximum performance
  • Simple hosting on any static host
  • Client-side search
Best for:
  • Smaller documentation sites
  • Hosting on Cloudflare Pages, Netlify, GitHub Pages
  • Maximum cost optimization
See Static Export for configuration details.

​
Framework-Specific Guides

Your deployment approach depends on your React framework:

​
Platform-Specific Considerations

​
Next.js + Cloudflare

Fumadocs does not work on Cloudflare’s Edge runtime.
Use OpenNext for Cloudflare to deploy Next.js applications with Fumadocs to Cloudflare Pages or Workers. See Cloudflare Deployment for detailed instructions.

​
Next.js + Docker

When deploying with Docker and Fumadocs MDX configured, you must include configuration files in your Docker image:
1
Update Dockerfile
2
Add source.config.ts and next.config.* to the COPY command:
3
FROM node:18-alpine AS deps
RUN apk add --no-cache libc6-compat
WORKDIR /app

# Include configuration files for Fumadocs MDX
COPY package.json yarn.lock* package-lock.json* pnpm-lock.yaml* .npmrc* source.config.ts next.config.* ./
RUN \
  if [ -f yarn.lock ]; then yarn --frozen-lockfile; \
  elif [ -f package-lock.json ]; then npm ci; \
  elif [ -f pnpm-lock.yaml ]; then corepack enable pnpm && pnpm i --frozen-lockfile; \
  else echo "Lockfile not found." && exit 1; \
  fi
4
Configure Output
5
In next.config.js, enable standalone output:
6
module.exports = {
  output: 'standalone',
};
7
Build and Deploy
8
Build your Docker image and deploy to your container platform:
9
docker build -t fumadocs-app .
docker run -p 3000:3000 fumadocs-app
See the Next.js Dockerfile Example for a complete reference.

​
Search Configuration

Search behavior varies by deployment model:

​
Server-Side Search (Default)

The built-in Orama search runs on the server and works out of the box with SSR deployments. For static exports, configure client-side search:
1
Configure Search Server
2
Follow the Static Export guide to pre-generate search indexes.
3
Update Search Client
4
Use the static search client in your components:
5
import { SearchDialog } from 'fumadocs-ui/components/dialog/search';

export function Search() {
  return (
    <SearchDialog
      search={{
        type: 'static',
        index: '/search-index.json',
      }}
    />
  );
}

​
Cloud Search Solutions

Third-party search providers work with both deployment models:

​
Environment Variables

Set environment variables based on your platform:

​
Vercel

Configure in Project Settings → Environment Variables or use vercel.json.

​
Cloudflare Pages

Set in Pages project settings or use .dev.vars for local development.

​
Docker

Pass variables with docker run -e or use .env files with docker-compose.

​
Build Commands

​
Next.js

package.json
{
  "scripts": {
    "build": "next build",
    "start": "next start"
  }
}

​
With Pre/Post Build Scripts

package.json
{
  "scripts": {
    "build": "npm run build:pre && next build && npm run build:post",
    "build:pre": "node ./scripts/pre-build.js",
    "build:post": "node ./scripts/post-build.js",
    "start": "next start"
  }
}

​
Next Steps

Build docs developers (and LLMs) love

Get started for freeTalk to us