'React' refers to a UMD global, but the current file is a module

미션 진행 중 갑자기 예전에 마주했던 오류와 마주하게 됐습니다.

 

이 오류가 발생하는 이유는 리액트 17버전 이하일 때 React를 import해오지 않기 때문인데요.

 

그러나! 저는 리액트 18버전임에도 이 오류와 맞닥뜨리게 되었습니다. 전에도 만난 기억이 있기 때문에 이참에 정리를 한번 해두는 것도 나쁘지 않다 생각해 여러 가지 해결방법을 기록해두겠습니다. 

---

1. 오류에 순응하고 React를 import해오는 방법

import React from 'react'

 

2. tsconfig.json의 옵션을 수정하는 방법

a. jsx 옵션 설정

"complierOptions": {
    // ...
    "jsx": "react-jsx",
    // ...
}

b. 경로 문제

"include": [
    /** 오류가 발생하는 파일의 경로가 포함되어 있는지 확인 */ 
]

 

3. eslint 설정 확인

"rules": {
    // ...
    "react/react-in-jsx-scope": "off",
    // ...
}

---

제가 포스팅한 방법 이외의 해결책도 있다면 알려주시면 감사하겠습니다😄