MENU

React Styleguidist

React Styleguidist allows you to visualize and interactively showcase your React components as you code them.To install it:

By default Styleguidist will search components using this glob pattern:

src/components/**/*.{js,jsx,ts,tsx}.

It will pick up files like:

src/components/Button.js,

src/components/Button/Button.js,

src/components/Button/index.js.

But will ignore tests:

__tests__ folder,

files containing .test.js or .spec.js (or same for .jsx, .ts and .tsx).

If it doesn't work for you, create a styleguide.config.js file in your project's root folder and configure the patterns to fit your project structure.

To launch the Styleguidist development server: