1. create-react-app

• create-react-app with typescript
• 실행전에 create-react-app 이 npm install -g 로 설치되어 있다면 uninstall 해준다.

npx create-react-app [directory name] --template typescript

• 만약 위 명령어로 설치했는데, 정상적으로 동작하지 않는다면 이전 캐시를 사용했을 가능성이 높으므로

npm uninstall -g create-react-app 이후 다시 설치해본다.

• 잘 설치되었다면, ./src/ 에 미리 세팅해주는 파일들이 전부 tsx, ts 등의 타입스크립트 관련 확장자 일 것이다.
• 아래와 같이 입력하여 정상적으로 동작하는지 확인한다.

npm run start

2. babel-loader 호환성 해결

• 최신 버전의 create-react-app 이 설치해준 package.json 에 있는 babel-loader 는 충돌할 가능성이 높다.
• ./.env 에 아래와 같이 입력해준다.

SKIP_PREFLIGHT_CHECK=true

3. storybook

• npm 으로는 설치가 잘 안된다. 이유는 모르겠다
• yarn 으로 설치한다. 엄청난 warning 이 뜬다.

yarn add --dev @storybook/react

• 설치후 package.json 에 다음과 같이 수정해준다.

  "scripts": {
    "story": "start-storybook -p 9001 -c .storybook",
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },

• yarn 을 이용해서 설치해서 그런지 npm run story 시 잘 동작을 안함