Vite로 생성한 React + TypeScript 에러 해결 ('react/jsx-runtime' 모듈 또는 해당 형식 선언을 찾을 수 없습니다. ' JSX.IntrinsicElements'인터페이스가 없으므로 JSX 요소는 암시적으로 'any' 형식입니다.)

'react/jsx-runtime' 모듈 또는 해당 형식 선언을 찾을 수 없습니다.
' JSX.IntrinsicElements'인터페이스가 없으므로 JSX 요소는 암시적으로 'any' 형식입니다.

 

vite로 React + Ts 프로젝트를 생성했는데,
프로젝트 실행에는 문제가 없었지만 모든 파일에 빨간줄 천지가 되었다;;

 

yarn.lock 파일 node_modules 를 삭제 후, 재설치 해보고

프로젝트도 몇번씩 삭제 후 재설치해보고

VSCode도 껐다 켜보고 컴퓨터도 재부팅 해봤다.

 

2시간 가량의 삽질 끝에 겨우 해결하였는데, 문제는 정말 단순했다.

 

현재 React 최신버전이 18버전인데, 그에 따라 typescript도 지원하는 버전으로 업데이트 해주어야 한다.

React 18 버전에는 TypeScript 4.4 이상이 권장되는데, 나는 4.4 미만이었던 것이다.

 

npm install typescript@latest --save-dev

yarn install typescript@latest --save-dev

 

이렇게 타입스크립트 버전을 업데이트 해주니, 거짓말 처럼 모든 에러가 사라졌다.

 

최신버전을 잘 유지하자^~^