[ReactTS] React TypeScript 프로젝트 생성 방법

1. 새로운 프로젝트 생성 방법.

npx create-react-app 파일명 --template typescript

 

TypeScript 프로젝트

• 확장자 ts :  순수 TypeScript 파일이다. (JavaScript의 .js)
• 확장자 tsx : TypeScirpt에 React문법을 담은 확장자 파일이다. (JavaScript의 .jsx)

 

 

 

2. 기존 ReactJS파일을 TypeScript로 변환 방법.

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

• @types/이 package이름에 앞에 붙음으로써 nodeJS, react, jest 각각에 typescript의 문법을 적용
• 이후, js확장자를 tsx확장자로 변경

 

 

 

3. 라이브러리 설치 방법

npm install --save 라이브러리명       // 라이브러리 설치
npm i --save-dev @types/라이브러리명  // 설치받은 라이브러리 TypeScript로 변환