close
logologo
Guide
Config
Plugin
API
Community
Version
Changelog
Rsbuild 0.x Doc
English
简体中文
Guide
Config
Plugin
API
Community
Changelog
Rsbuild 0.x Doc
English
简体中文
logologo

Getting Started

Introduction
Quick start
Features
Glossary

Framework

React
Vue
Preact
Svelte
Solid

Basic

CLI
Dev server
Output files
Static assets
HTML
JSON
Wasm
TypeScript
Web Workers
Deploy static site
Upgrade Rsbuild

Configuration

Configure Rspack
Configure Rsbuild
Configure SWC

Styling

CSS
CSS Modules
CSS-in-JS
Tailwind CSS v4
Tailwind CSS v3
UnoCSS

Advanced

Path aliases
Environment variables
Hot module replacement
Browserslist
Browser compatibility
Module Federation
Multi-environment builds
Server-side rendering (SSR)
Testing

Optimization

Code splitting
Bundle size optimization
Improve build performance
Inline static assets

Migration

Migrating from Rsbuild 0.x
webpack
Create React App
Vue CLI
Vite
Vite plugin
Modern.js Builder

Debug

Debug mode
Build profiling
Use Rsdoctor

FAQ

General FAQ
Features FAQ
Exceptions FAQ
HMR FAQ
📝 Edit this page on GitHub
Previous PageSolid
Next PageDev server

#CLI

Rsbuild includes a lightweight CLI with commands like rsbuild dev and rsbuild build.

#All commands

To view all available CLI commands, run this command in your project directory:

npx rsbuild -h

The output is shown below:

Usage:
  $ rsbuild <command> [options]

Commands:
  dev      Start the dev server
  build    Build the app for production
  preview  Preview the production build locally
  inspect  Inspect the Rspack and Rsbuild configurations

#Common flags

The Rsbuild CLI includes several common flags that work with all commands:

FlagDescription
--base <base>Set the base path of the server, see server.base
-c, --config <config>Set the configuration file (relative or absolute path), see Specify config file
--config-loader <loader>Set the config file loader (auto | jiti | native), see Specify config loader
--env-mode <mode>Set the env mode to load the .env.[mode] file, see Env mode
--env-dir <dir>Set the directory for loading .env files, see Env directory
--environment <name>Set the environment name(s) to build, see Build specified environment
-h, --helpDisplay help for command
--log-level <level>Set the log level (info | warn | error | silent), see logLevel
-m, --mode <mode>Set the build mode (development | production | none), see mode
--no-envDisable loading of .env files
-r, --root <root>Set the project root directory (absolute path or relative to cwd)

#rsbuild dev

The rsbuild dev command starts a local dev server and compiles source code for development.

Usage: rsbuild dev [options]

Options:
  -o, --open [url]      Open the page in browser on startup
  --port <port>         Set the port number for the server
  --host <host>         Set the host that the server listens to

Start the dev server by running rsbuild directly (equivalent to rsbuild dev):

npx rsbuild

#Opening page

The --open option automatically opens a page when starting the dev server (equivalent to setting server.open to true).

rsbuild dev --open

The --open option also supports specifying a URL to open, for example:

rsbuild dev --open http://localhost:3000/foo

The --open option can also be abbreviated to -o:

rsbuild dev -o
TIP

When using both server.open and --open, the --open option takes precedence.

#rsbuild build

The rsbuild build command builds production outputs in the dist/ directory by default.

Usage: rsbuild build [options]

Options:
  -w, --watch           Enable watch mode to automatically rebuild on file changes

#rsbuild preview

The rsbuild preview command previews production build outputs locally. You must run rsbuild build first to generate the build outputs.

Usage: rsbuild preview [options]

Options:
  -o, --open [url]      Open the page in browser on startup
  --port <port>         Set a port number for Rsbuild server to listen
  --host <host>         Set the host that the Rsbuild server listens to
TIP

The preview command is only used for local preview. Do not use it for production servers, as it is not designed for that.

#rsbuild inspect

The rsbuild inspect command displays the project's Rsbuild and Rspack configurations.

Usage: rsbuild inspect [options]

Options:
  --output <output>     Set the output path for inspection results (default: ".rsbuild")
  --verbose             Show complete function definitions in output

Running npx rsbuild inspect in the project root generates these files in the dist/.rsbuild directory:

  • rsbuild.config.mjs: Represents the Rsbuild configuration used during the build.
  • rspack.config.web.mjs: Represents the Rspack configuration used during the build.
➜ npx rsbuild inspect

config inspection completed, generated files:

  - Rsbuild config: /project/dist/.rsbuild/rsbuild.config.mjs
  - Rspack config (web): /project/dist/.rsbuild/rspack.config.web.mjs

#Setting mode

By default, the inspect command outputs configuration for development mode. Add the --mode production option to output production mode configuration:

rsbuild inspect --mode production

#Verbose content

By default, the inspect command omits function content in the configuration object. Add the --verbose option to output complete function content:

rsbuild inspect --verbose

#Multiple targets

If the current project has multiple build targets (such as building both browser and Node.js bundles), multiple Rspack configuration files will be generated in the dist/.rsbuild directory.

➜ npx rsbuild inspect

config inspection completed, generated files:

  - Rsbuild config (web): /project/dist/.rsbuild/rsbuild.config.web.mjs
  - Rsbuild config (node): /project/dist/.rsbuild/rsbuild.config.node.mjs
  - Rspack config (web): /project/dist/.rsbuild/rspack.config.web.mjs
  - Rspack config (node): /project/dist/.rsbuild/rspack.config.node.mjs