본문 바로가기

카테고리 없음

[React] CRA 로 만든 프로젝트에 Storybook 추가하기

설치

CRA 로 프로젝트를 생성한 경우에는 --type react_scripts 와 함께 init 을 해야한다.

$ npx @storybook/cli sb init --type react_scripts

설치를 하고나면, .storybook 폴더와 stories 폴더가 생겼다. stories 폴더는 지워도 상관없다. 보통은 컴포넌트와 함께 story를 작성한다.

실행

$ npm run storybook

Github page 배포

$ npm i @storybook/storybook-deployer --save-dev

package.json 에 아래 스크립트 추가

{
  "scripts": {
    "deploy-storybook": "storybook-to-ghpages"
  }
}

추가 후 아래 명령어 실행

$ npm run deploy-storybook