close
Rslib
Guide
Config
Guide
Config

CLI

Rslib comes with a lightweight CLI that includes commands such as rslib build and rslib inspect.

rslib -h

To view all available CLI commands, run the following command in the project directory:

npx rslib -h

The output is shown below:

Usage: rslib <command> [options]

Options:
  -V, --version      output the version number
  -h, --help         display help for command

Commands:
  build [options]    build the library for production
  inspect [options]  inspect the Rsbuild / Rspack configs of Rslib projects
  mf-dev [options]   start Rsbuild dev server of Module Federation format
  help [command]     display help for command

rslib build

The rslib build command will build the outputs for production in the dist/ directory by default.

Usage: rslib build [options]

build the library for production

Options:
  -c --config <config>  specify the configuration file, can be a relative or absolute path
  -r --root <root>      specify the project root directory, can be an absolute path or a path relative to cwd
  --env-mode <mode>     specify the env mode to load the `.env.[mode]` file
  --env-dir <dir>       specify the directory to load `.env` files
  --lib <id>            specify the library (repeatable, e.g. --lib esm --lib cjs)
  -w --watch            turn on watch mode, watch for changes and rebuild
  -h, --help            display help for command

Watch Mode

You can use rslib build --watch or rslib build -w to enable watch mode for watching for changes and rebuild.

npx rslib build -w

Environment Variables

Rslib supports injecting env variables or expressions into the code during build, which is helpful for distinguishing the running environment or replacing constants.

You can see more details in Rsbuild - Environment Variables.

NOTE
  • If format is esm or cjs, process.env.NODE_ENV will be preserved in the build output.
  • If format is mf or umd, process.env.NODE_ENV will be replaced to ensure that the output can run in the browser.

Env Mode

Rslib supports reading .env.[mode] and .env.[mode].local files. You can specify the env mode using the --env-mode <mode> flag.

For example, set the env mode as test:

npx rslib build --env-mode test

Rslib will then read the following files in sequence:

  • .env
  • .env.local
  • .env.test
  • .env.test.local
TIP

The --env-mode option takes precedence over process.env.NODE_ENV.

It is recommended to use --env-mode to set the env mode, and not to modify process.env.NODE_ENV.

Env Directory

By default, the .env file is located in the root directory of the project. You can specify the env directory by using the --env-dir <dir> option in the CLI.

For example, to specify the env directory as config:

npx rslib build --env-dir config

In this case, Rslib will read the ./config/.env and other env files.

Example

For example, create a .env file and add the following contents:

.env
FOO=hello
BAR=1

Then in the rslib.config.ts file, you can access the above env variables using import.meta.env.[name] or process.env.[name]:

rslib.config.ts
console.log(import.meta.env.FOO); // 'hello'
console.log(import.meta.env.BAR); // '1'

console.log(process.env.FOO); // 'hello'
console.log(process.env.BAR); // '1'

Now, create a .env.local file and add the following contents:

.env.local
BAR=2

The value of BAR is overwritten to '2':

rslib.config.ts
console.log(import.meta.env.BAR); // '2'
console.log(process.env.BAR); // '2'

rslib inspect

The rslib inspect command is used to view the Rsbuild config and Rspack config of the Rslib project.

Usage: rslib inspect [options]

inspect the Rsbuild / Rspack configs of Rslib projects

Options:
  -c --config <config>  specify the configuration file, can be a relative or absolute path
  -r --root <root>      specify the project root directory, can be an absolute path or a path relative to cwd
  --env-mode <mode>     specify the env mode to load the `.env.[mode]` file
  --env-dir <dir>       specify the directory to load `.env` files
  --lib <id>            specify the library (repeatable, e.g. --lib esm --lib cjs)
  --output <output>     specify inspect content output path (default: ".rsbuild")
  --verbose             show full function definitions in output
  -h, --help            display help for command

When you run the command npx rslib inspect in the project root directory, the following files will be generated in the dist/.rsbuild directory of the project:

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

Inspect config succeed, open following files to view the content:

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

Verbose Content

By default, the inspect command omits the content of functions in the configuration object. You can add the --verbose option to output the complete content of functions:

rslib inspect --verbose

Multiple Output Formats

If the current project has multiple output formats, such as ESM artifact and CJS artifact simultaneously, multiple Rspack configuration files will be generated in the dist/.rsbuild directory.

➜ npx rslib inspect

Inspect config succeed, open following files to view the content:

  - Rsbuild Config (esm): /project/dist/.rsbuild/rsbuild.config.esm.mjs
  - Rsbuild Config (cjs): /project/dist/.rsbuild/rsbuild.config.cjs.mjs
  - Rspack Config (esm): /project/dist/.rsbuild/rspack.config.esm.mjs
  - Rspack Config (cjs): /project/dist/.rsbuild/rspack.config.cjs.mjs

rslib mf-dev

The rslib mf-dev command is utilized to start Rsbuild dev server for the Module Federation format.

This enables you to develop and debug your mf format module within the host app.

Usage: rslib mf-dev [options]

start Rsbuild dev server of Module Federation format

Options:
  -c --config <config>  specify the configuration file, can be a relative or absolute path
  -r --root <root>      specify the project root directory, can be an absolute path or a path relative to cwd
  --env-mode <mode>     specify the env mode to load the `.env.[mode]` file
  --env-dir <dir>       specify the directory to load `.env` files
  --lib <id>            specify the library (repeatable, e.g. --lib esm --lib cjs)
  -h, --help            display help for command

Common Options

Filter Libraries

Rslib provides the --lib option to run command for specified libraries.

# Only build the library with id `esm`
npx rslib build --lib esm

The --lib option can be repeated to specify multiple libraries.

# Build the libraries with id `esm` and `cjs`
npx rslib build --lib esm --lib cjs

Check out the lib.id to learn how to get or set the library ID.