[React] Migrate JavaScript to TypeScript

1. 타입스크립트를 기존 프로젝트에 설치한다.

npm install typescript

2. 기존에 설치되어 있던 패키지들을 타입스크립트 버전으로 설치한다.

npm install @types/---

ex) npm install @types/react-router-dom

3. tsconfig.json을 추가한다.

npx tsc --init

• 기존에 jsconfig.json이 있다면 지워주자.

4. jsx 파일들을 tsx로 바꾼다.

• 자바스크립트 파일과 타입스크립트 파일이 공존할 수 있게 하려면 tsconfig.json에서 "allowJs": true,를 해주자.

// tsconfig.json

{
  "compilerOptions": {
     "allowJs": true,
  }
}

여러 설정들

ts-config

// tsconfig.json

{
  "compilerOptions": {
    "baseUrl": "src", // 절대경로 설정
    "jsx": "react-jsx", // jsx와의 호환
  }
}

global.d.ts

• declare

참고

• how to migrate a react app to typescript