How Documentation for Dify Chat Is Generated: The Complete Technical Guide

Dify Chat uses Rspress, a React-based static site generator, to transform Markdown files in packages/docs/docs/ into a versioned static documentation site.

The open-source repository lexmin0412/dify-chat maintains a comprehensive documentation system powered by modern static site generation tools. Understanding how the documentation for Dify Chat is generated helps contributors add new guides and enables developers to build custom documentation pipelines. The system leverages Rspress to convert MDX content into optimized static HTML, supporting multiple versions and full-text search.

Rspress Configuration

The documentation build process centers around packages/docs/rspress.config.ts, which defines how Rspress processes the source content.

This configuration file establishes several critical parameters:

• root: Points to the docs folder containing all Markdown source files
• base: Sets the URL base path to /dify-chat-docs/
• multiVersion: Enables versioned documentation (Latest, v0.6.x, v0.5.x, v0.4.x)
• search.versioned: Configures the search index to respect the selected documentation version
• builderConfig.server.port: Specifies port 6200 for the development server
• themeConfig.socialLinks: Adds the GitHub repository link to the site header

The configuration also defines site metadata including the title and favicon icon, ensuring consistent branding across all generated pages.

Build Scripts and Local Development

The packages/docs/package.json provides the NPM scripts that interface with the Rspress CLI:

{
  "scripts": {
    "dev": "rspress dev",
    "build": "rspress build",
    "preview": "rspress preview"
  }
}

These commands enable three distinct workflows:

1. rspress dev: Starts a local development server with hot-reload functionality on port 6200
2. rspress build: Compiles all Markdown and MDX files into a static site output
3. rspress preview: Serves the built site locally for final verification before deployment

To execute these commands from the repository root, use the workspace filter:

# Build the documentation site

pnpm --filter @dify-chat/docs run build

# The output is written to packages/docs/dist/

Content Structure and Versioning

All documentation source files reside in packages/docs/docs/ as standard Markdown (.md) or MDX (.mdx) files. The directory structure mirrors the version configuration defined in rspress.config.ts.

For example, the current version documentation lives in:

packages/docs/docs/Latest/

Within this structure, content is organized by category:

packages/docs/docs/Latest/guide/app-config/custom-user-info.mdx

The repository supports multi-version documentation, allowing users to access guides for specific releases (Latest, v0.6.x, v0.5.x, v0.4.x). When the build process runs, Rspress generates separate routes for each version while maintaining a consistent URL structure.

Build and Deployment Process

When rspress build executes, the generator performs several operations:

1. Parse: Reads each Markdown and MDX file in the source directory
2. Transform: Resolves React components (such as Tabs, Tab, and custom UI elements) within MDX files
3. Bundle: Generates optimized HTML, CSS, and JavaScript assets
4. Emit: Writes the final static site to packages/docs/dist/

The resulting dist/ directory contains the complete static website, ready for deployment to any static file server or integration into the main Next.js application. The built assets are typically served from the path /dify-chat-docs/ as configured by the base parameter.

Summary

• Dify Chat documentation is generated using Rspress, a React-based static site generator configured in packages/docs/rspress.config.ts.
• The build pipeline uses standard NPM scripts (dev, build, preview) defined in packages/docs/package.json to manage development and production builds.
• Source content consists of Markdown and MDX files stored in packages/docs/docs/, organized by version (Latest, v0.6.x, etc.).
• The build process outputs static HTML to packages/docs/dist/, which can be deployed independently or integrated into the main application at the /dify-chat-docs/ base path.
• Multi-version support and version-aware search are enabled through the Rspress configuration, ensuring users find relevant content for their specific Dify Chat version.

Frequently Asked Questions

What static site generator does Dify Chat use for documentation?

Dify Chat uses Rspress, a modern React-based static site generator that supports MDX, versioning, and full-text search. The generator is configured in packages/docs/rspress.config.ts and processes Markdown files from the packages/docs/docs/ directory.

How do I build the Dify Chat documentation locally?

Run pnpm --filter @dify-chat/docs run build from the repository root. This command invokes the Rspress CLI and outputs the static site to packages/docs/dist/. For development with hot-reload, use pnpm --filter @dify-chat/docs run dev to start a server on port 6200.

Where is the documentation source content stored?

All source files are located in packages/docs/docs/ within the repository. The content uses standard Markdown (.md) and MDX (.mdx) formats, organized into versioned subdirectories such as Latest/, v0.6.x/, v0.5.x/, and v0.4.x/ to match the multi-version configuration in rspress.config.ts.

Does Dify Chat support versioned documentation?

Yes. The documentation system supports multiple versions simultaneously through the multiVersion configuration in rspress.config.ts. The search functionality is also version-aware (search.versioned = true), ensuring users only see results relevant to the documentation version they are currently viewing.

{
  "mcpServers": {
    "instagit": {
      "command": "npx",
      "args": ["-y", "instagit@latest"]
    }
  }
}