#Quick start

#Environment preparation

Rspress supports using Node.js, Deno, or Bun as the JavaScript runtime.

Use one of the following installation guides to set up a runtime:

• Install Node.js
• Install Bun
• Install Deno

#1. Initialize the project

#Method 1: create via CLI

You can create a Rspress project using the create-rspress cli:

npm create rspress@latest

yarn create rspress

pnpm create rspress@latest

bun create rspress@latest

deno init --npm rspress@latest

Input the project directory name, and then the cli will create the project for you.

#Using Agent Skills

If you plan to maintain the documentation site with an AI agent, you can select Agent Skills during project creation. The CLI will generate a .agents/skills directory in your project and add the selected skills there.

For most documentation sites, we recommend selecting:

• rspress-best-practices: provides Rspress project structure, config, MDX, theme, and deployment guidance for AI agents.
• rspress-description-generator: helps AI agents write and maintain page descriptions for SEO, search, and AI-readable outputs.

If you choose to customize the default theme, you can also select:

• rspress-custom-theme: enables your AI agent to customize the Rspress theme, such as CSS variables, layout slots, and theme component overrides.

These skills do not affect the runtime behavior of your Rspress site. They only provide local guidance for AI agents when editing or maintaining the project. If you do not use an AI agent, you can press Enter to skip this option.

For more information about Agent Skills and other AI-related capabilities, see AI.

#Method 2: manual creation

First, you can create a new directory with the following command:

mkdir rspress-app && cd rspress-app

Execute npm init -y to initialize a project. You can install Rspress using npm, pnpm, yarn or bun:

npm install @rspress/core -D

yarn add @rspress/core -D

pnpm add @rspress/core -D

bun add @rspress/core -D

deno add npm:@rspress/core -D

Then create the file with the following command

mkdir docs && echo '# Hello world' > docs/index.md

Add the following script to package.json:

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

Then initialize a configuration file rspress.config.ts:

import { defineConfig } from '@rspress/core';

export default defineConfig({
  root: 'docs',
});

And then create tsconfig.json, add the following config:

{
  "compilerOptions": {
    "lib": ["DOM", "ES2023"],
    "jsx": "react-jsx",
    "target": "ES2023",
    "noEmit": true,
    "skipLibCheck": true,
    "useDefineForClassFields": true,

    /* modules */
    "module": "ESNext",
    "moduleDetection": "force",
    "moduleResolution": "bundler",
    "verbatimModuleSyntax": true,
    "resolveJsonModule": true,
    "allowImportingTsExtensions": true,
    "noUncheckedSideEffectImports": true,
    "isolatedModules": true,

    /* type checking */
    "strict": true,
    "noUnusedLocals": true,
    "noUnusedParameters": true
  },
  "include": ["docs", "theme", "rspress.config.ts"],
  "mdx": {
    "checkMdx": true
  }
}

#2. Start dev server

Start the local development service with the following command:

npm run dev

#3. Build in production

Build the production bundle with the following command :

npm run build

By default, Rspress will set doc_build as the output directory.

#4. Preview in local environment

Start the local preview service with the following command:

npm run preview