#React

Storybook for React & Rsbuild lets you develop and test React components in isolation using the Rsbuild toolchain your app already relies on.

#Requirements

#Getting started

Follow these steps inside an existing Rsbuild-powered React project.

#Installation

Install the framework package to enable React support.

npm install storybook-react-rsbuild -D

yarn add storybook-react-rsbuild -D

pnpm add storybook-react-rsbuild -D

bun add storybook-react-rsbuild -D

deno add npm:storybook-react-rsbuild -D

#Configure .storybook/main.ts

import { StorybookConfig } from 'storybook-react-rsbuild'

const config: StorybookConfig = {
  framework: 'storybook-react-rsbuild',
  rsbuildFinal: (config) => {
    // Customize the final Rsbuild config here
    return config
  },
}

export default config

That's it! Explore the React 16 and React 18 sandboxes for full examples, and continue learning from the Storybook documentation.

#Next Steps

Now that you've set up the build system, learn how to write stories and document your components:

• Writing Stories: Learn the basics of Component Story Format (CSF).
• Auto-docs: Automatically generate documentation from your components.

#Options

Please refer to the Configuration Guide for framework-specific options and defaults.