The Rspack-based build tool providing high-performance bundling with comprehensive development features and plugin system.
npx @tessl/cli install tessl/npm-rsbuild--core@1.5.0Rsbuild is a high-performance build tool powered by Rspack that provides a comprehensive solution for modern web development. It serves as a modernized alternative to Create React App or Vue CLI with significantly improved build performance through its Rust-based Rspack bundler. The tool offers out-of-the-box support for TypeScript, JSX, Sass, Less, CSS Modules, and other modern web technologies, while maintaining compatibility with the webpack ecosystem.
npm install @rsbuild/coreimport { createRsbuild, defineConfig, loadConfig, loadEnv } from "@rsbuild/core";For CommonJS:
const { createRsbuild, defineConfig, loadConfig, loadEnv } = require("@rsbuild/core");import { createRsbuild, defineConfig } from "@rsbuild/core";
// Define configuration
const config = defineConfig({
source: {
entry: {
index: "./src/index.ts",
},
},
output: {
target: "web",
},
dev: {
hmr: true,
},
});
// Create Rsbuild instance
const rsbuild = await createRsbuild({ rsbuildConfig: config });
// Start development server
await rsbuild.startDevServer();
// Or build for production
await rsbuild.build();Rsbuild is built around several key components:
RsbuildInstance providing build and dev server methods with lifecycle hooksPrimary Rsbuild instance creation and build orchestration. Provides production builds, development server, and configuration management.
function createRsbuild(options?: CreateRsbuildOptions): Promise<RsbuildInstance>;
interface CreateRsbuildOptions {
cwd?: string;
rsbuildConfig?: RsbuildConfig | (() => Promise<RsbuildConfig>);
environment?: string[];
callerName?: string;
loadEnv?: boolean | LoadEnvOptions;
}
interface RsbuildInstance {
build(options?: BuildOptions): Promise<{
close: () => Promise<void>;
stats?: Rspack.Stats | Rspack.MultiStats;
}>;
preview(): Promise<void>;
startDevServer(options?: StartDevServerOptions): Promise<StartServerResult>;
createDevServer(): Promise<RsbuildDevServer>;
createCompiler(): Promise<Compiler>;
initConfigs(): Promise<InitConfigsResult>;
inspectConfig(options?: InspectConfigOptions): Promise<InspectConfigResult>;
addPlugins(plugins: RsbuildPlugins): void;
removePlugins(pluginNames: string[]): void;
getPlugins(): RsbuildPlugin[];
isPluginExists(pluginName: string, options?: { environment?: string }): boolean;
}Configuration loading, definition, and merging utilities. Handles both file-based and programmatic configuration.
function defineConfig(config: RsbuildConfig): RsbuildConfig;
function loadConfig(options?: LoadConfigOptions): Promise<LoadConfigResult>;
function mergeRsbuildConfig(...configs: RsbuildConfig[]): RsbuildConfig;
interface LoadConfigOptions {
cwd?: string;
path?: string;
meta?: Record<string, unknown>;
envMode?: string;
configLoader?: 'jiti' | 'native';
}Comprehensive plugin architecture with lifecycle hooks, configuration modification, and inter-plugin communication.
interface RsbuildPlugin {
name: string;
setup: (api: RsbuildPluginAPI) => MaybePromise<void>;
apply?: 'serve' | 'build' | ((config: any, context: any) => boolean);
enforce?: 'pre' | 'post';
pre?: string[];
post?: string[];
remove?: string[];
}
interface RsbuildPluginAPI {
context: RsbuildContext;
logger: Logger;
modifyRsbuildConfig: ModifyRsbuildConfigHook;
modifyEnvironmentConfig: ModifyEnvironmentConfigHook;
modifyBundlerChain: ModifyBundlerChainHook;
modifyRspackConfig: ModifyRspackConfigHook;
transform: TransformHook;
processAssets: ProcessAssetsHook;
expose: <T = any>(id: string, api: T) => void;
useExposed: <T = any>(id: string) => T | undefined;
}Development server functionality with hot module replacement, live reload, and debugging capabilities.
interface RsbuildDevServer {
listen(): Promise<void>;
close(): Promise<void>;
server: Connect.Server;
port: number;
host: string;
}
interface StartServerResult {
urls: string[];
port: number;
server: RsbuildDevServer;
}Multi-environment build support allowing simultaneous builds for different targets with environment-specific configurations.
interface EnvironmentConfig {
source?: SourceConfig;
output?: OutputConfig;
html?: HtmlConfig;
tools?: ToolsConfig;
dev?: DevConfig;
server?: ServerConfig;
security?: SecurityConfig;
performance?: PerformanceConfig;
moduleFederation?: ModuleFederationConfig;
}
interface EnvironmentContext {
name: string;
index: number;
entry: RsbuildEntry;
htmlPaths: Record<string, string>;
distPath: string;
browserslist: string[];
config: NormalizedEnvironmentConfig;
}Command-line interface functionality for build scripts and development workflows.
function runCLI(): Promise<void>;Environment variable loading and management from .env files with mode-specific support.
function loadEnv(options?: LoadEnvOptions): LoadEnvResult;
interface LoadEnvOptions {
cwd?: string;
mode?: string;
prefixes?: string[];
processEnv?: Record<string, string>;
}
interface LoadEnvResult {
parsed: Record<string, string>;
filePaths: string[];
rawPublicVars: Record<string, string | undefined>;
publicVars: Record<string, string>;
cleanup: () => void;
}interface RsbuildConfig {
mode?: 'development' | 'production' | 'none';
root?: string;
logLevel?: 'silent' | 'error' | 'warn' | 'info' | 'debug';
environments?: Record<string, EnvironmentConfig>;
source?: SourceConfig;
output?: OutputConfig;
html?: HtmlConfig;
tools?: ToolsConfig;
dev?: DevConfig;
server?: ServerConfig;
security?: SecurityConfig;
performance?: PerformanceConfig;
moduleFederation?: ModuleFederationConfig;
plugins?: RsbuildPlugins;
provider?: unknown;
}
interface RsbuildContext {
entry: RsbuildEntry;
target: RsbuildTarget;
mode: RsbuildMode;
rootPath: string;
distPath: string;
cachePath: string;
configPath?: string;
bundlerType: 'rspack' | 'webpack';
}
type RsbuildTarget = 'web' | 'node' | 'web-worker';
type RsbuildMode = 'development' | 'production' | 'none';
type RsbuildEntry = string | string[] | Record<string, string | string[] | RsbuildEntryDescription>;
type RsbuildPlugins = (RsbuildPlugin | RsbuildPluginOptions)[];
interface RsbuildEntryDescription {
import: string | string[];
filename?: string;
runtime?: string;
publicPath?: string;
}
interface Logger {
info(...args: unknown[]): void;
warn(...args: unknown[]): void;
error(...args: unknown[]): void;
success(...args: unknown[]): void;
debug(...args: unknown[]): void;
ready(...args: unknown[]): void;
}const version: string;
const PLUGIN_CSS_NAME = 'rsbuild:css';
const PLUGIN_SWC_NAME = 'rsbuild:swc';
const defaultAllowedOrigins: RegExp;function ensureAssetPrefix(url: string, assetPrefix?: string): string;
const logger: Logger;
const rspack: typeof import('@rspack/core');
type Rspack = typeof import('@rspack/core');