320x100
320x100

1. types 패키지 설치

- npm

npm install --save typescript @types/node @types/react @types/react-dom @types/jest

 

- yarn

yarn add typescript @types/node @types/react @types/react-dom @types/jest

 

 

 

 

 

2. package.json 확인

: @types ~ 로 시작하는 타입스크립트 관련 라이브러리 설치 여부 확인

// "dependencies"
"@types/jest": "^29.5.8",
"@types/node": "^20.9.2",
"@types/react": "^18.2.37",
"@types/react-dom": "^18.2.15",
"typescript": "^5.2.2",

 

 

 

 

 

3. tsconfig 추가

npx tsc --init

: 실행 후 tsconfig.json 파일 확인

 

 

 

 

4. 주요 파일들 이름을 ts로 변경 (깃 히스토리 손실 없이 변환)

- VSCode에서 터미널을 git bash로 실행 후 아래 명령어 입력

ls ./src/**/*.js | 
    while read line; do git mv -- $line ${line%.js}.ts; done;

: src/app.js가 있다면 ls 뒤에 경로에서 **/제거

 

 

 

 

 

 

NodeJS 타입스크립트 설정

1) ts-node 설치

npm install -g ts-node

 

2) 실행

ts-node ./app.ts

 

 

 

 

 

 

Reference

 

JS프로젝트를 TS로 리팩토링하기

이전에 React와 Javascript로 제작했던 자기소개 사이트 개인 프로젝트가 있었는데, 내용 업데이트도 해야하고, 요새 TypeScript를 공부하고 있다보니 연습도 해볼 겸 이를 적용해서 바꾸고 싶었다.

velog.io

 

Convert a react app from flow to typescript without losing git history

start with creating a new branch git checkout -b "moving-from-flow-to-ts" R...

dev.to

 

300x250
728x90