Configure Storybook

• https://www.learnstorybook.com/

Setup

Install Dependencies

yarn add -D @storybook/react babel-loader @babel/core

Add npm script

{
  "scripts": {
    "storybook": "start-storybook",
    "storybook:build": "build-storybook -c .storybook"
  }
}

config file

.storybook/config.js

import { configure } from '@storybook/react';

const req = require.context('../stories', true, /.stories.js$/);

function loadStories() {
  req.keys().forEach(filename => req(filename));
}

configure(loadStories, module);

Addons

yarn add -D @storybook/addon-knobs @storybook/addon-actions @storybook/addon-links

config file

.storybook/addons.js

import '@storybook/addon-actions/register';
import '@storybook/addon-knobs/register';
import '@storybook/addon-links/register';