[React]import시 나는 오류 해결법 정리

[참고]프로젝트 기본 설정
React, Styled-component, TypeScript, Yarn, Vercel

Cannot find module 'react' or its corresponding type declarations.ts(2307)
[문제원인] TypeScript가 'react' 모듈을 찾을 수 없거나 해당 모듈에 대한 타입 선언을 찾을 수 없음
[해결방법] React DOM 및 패키지 설치(React DOM 사용시 적용 가능)

yarn install --save-dev@types/react

 

An import path can only end with a '.tsx' extension when 'allowImportingTsExtensions' is enabled.ts(5097)
[문제 원인] TypeScript 설정에서 allowImportingTsExtensions 옵션이 비활성화된 상태에서 .tsx 파일 확장자 사용 시도
[해결방법] ts.config에서 해당 설정 true 변경

{
  "compilerOptions": {
    "allowImportingTsExtensions": true,
    // Others...
  }
}

cf) ts.config가 안 보인다면? ts.config 생성하기!

yarn tsc --init