close
logo
Rslib
Guide
Config
Blog
English
简体中文
Guide
Config
Blog
English
简体中文
logo
Rslib

Getting Started

Introduction
Quick start
Glossary
Packages

Solution

Node.js
React
Vue

Basic

CLI
Configure Rslib
Use TypeScript
Output format
Output structure
Upgrade Rslib

Advanced

Handle third-party dependencies
Output compatibility
Declaration files
Import static assets
Import SVGR
Import JSON files
Module Federation
Use Storybook

Migration

Modern.js Module
tsup

FAQ

Features FAQ
📝 Edit this page on GitHub
Previous PageIntroduction
Next PageGlossary

#Quick start

#Setup environment

Before getting started, you will need to install Node.js >= 18.12.0, it is recommended to use the Node.js LTS version.

Check the current Node.js version with the following command:

node -v

If you do not have Node.js installed in current environment, or the installed version is too low, you can use nvm or fnm to install.

Here is an example of how to install via nvm:

# Install Node.js LTS
nvm install --lts
# Switch to Node.js LTS
nvm use --lts

#Creating an Rslib project

You can use the create-rslib to create a new Rslib project. Run the following command:

npm
yarn
pnpm
bun
npm create rslib@latest

Then follow the prompts to complete the operation.

#Templates

create-rslib is a tool for quickly creating Rslib projects. When creating a project, you can choose from the following templates:

TemplateDescription
Node.js dual ESM/CJS packageNode.js dual ESM/CJS package
Node.js pure ESM packageNode.js pure ESM package
ReactReact component library
VueVue component library

Each template supports both JavaScript and TypeScript, along with optional development tools, formatters, and linters.

#Development tools

create-rslib can help you set up some commonly used development tools, including Rstest, Vitest, Storybook. You can use the arrow keys and the space bar to make your selections. If you don't need these tools, you can simply press Enter to skip.

  • Rstest and Vitest are available for all templates, it will be adapted based on the template's selection.
  • Storybook is available for web targeted templates (React, Vue), it will be adapted based on the template's selection.
◆  Select development tools (Use <space> to select, <enter> to continue)
│  ◻ Storybook
│  ◻ Rstest
│  ◻ Vitest
└

#Optional tools

create-rslib can help you set up some commonly used linter and formatter tools, including Biome, ESLint, and prettier. You can use the arrow keys and the space bar to make your selections. If you don't need these tools, you can simply press Enter to skip.

◆  Select additional tools (Use <space> to select, <enter> to continue)
│  ◻ Add Biome for code linting and formatting
│  ◻ Add ESLint for code linting
│  ◻ Add Prettier for code formatting
└
TIP

Biome provides similar linting and formatting features to ESLint and Prettier. If you select Biome, you typically won't need to choose ESLint or Prettier as well.

#Current directory

If you need to create a project in the current directory, you can set the target folder to .:

◆  Create Rslib Project
│
◇  Project name or path
│  .
│
◇  "." is not empty, please choose:
│  Continue and override files

#Quick creation

create-rslib provides some CLI flags. By setting these CLI flags, you can skip the interactive selection steps and create the project with one command.

For example, to create an example project in the my-project directory with one command:

npx create-rslib --dir my-project --template example

# Using abbreviations
npx create-rslib -d my-project -t example

All the CLI flags of create-rslib:

Usage: create-rslib [options]

Options:

  -h, --help       display help for command
  -d, --dir        create project in specified directory
  -t, --template   specify the template to use
  --tools          select additional tools (biome, eslint, prettier)
  --override       override files in target directory

#Migrate from existing projects

To migrate from an existing project to Rslib, refer to the following guides:

  • Migrating from tsup
  • Migrating from Modern.js Module

#Other projects

For other types of projects, you can manually install the @rslib/core package:

npm
yarn
pnpm
bun
npm add @rslib/core -D

Then refer to the guide and documentation to enable the features you need:

  • See CLI to learn about available CLI commands.
  • See Configure Rslib to configure Rslib.