[ERROR] type '{}' is not assignable to type 'reactnode'.

위 에러가 발생한 프로젝트에서 사용하는 react, @types/react의 버전은 아래와 같다.

"react": "^18.2.0",

"@types/react": "^18.0.31",

나는 react-datepicker를 설치해야해서 

react-datepicker, @types/react-datepicker 를 설치하고, 

컴포넌트에서 아래처럼 사용해보니

type '{}' is not assignable to type 'reactnode'

위와 같은 에러가 났다.

import DatePicker from 'react-datepicker';

 <DatePicker
          wrapperClassName={cx('datepicker-wrapper')}
          selected={startDate}
          onChange={(date: Date) => setStartDate(date)}
          startOpen={showDatePicker}
          onClickOutside={() => setShowDatePicker(false)}
          onSelect={(date) => {
            onUpdateDate(user.id, date.toString());
          }}
          customInput={
            <CustomDatePicker
              value={startDate}
              onClick={() => setShowDatePicker((prev) => !prev)}
            />
          }
        />

저 에러는 예전에도 봤었는데, react18떄문에 발생했었다.

그래서 혹시 react-datepicker가 18버전지원이 안되는건지 확인해봤는데 그건 또 아님...

그리고 react-datepicker를 사용할때 나와같은 버그를 봤다는 글도 얼마없었다....

 

저 에러메시지 기준으로 구글링을 해보니 peerDependencies에 react, @types/react의 버전을 다양하게 적어주라곤 하던데, 그것도 해결책이 아니었음

 

그래서 일단 node_modules와 yarn.lock파일을 모두 지우고 다시 yarn 으로 설치하니 이제 제대로 동작함ㅋ.....후우

어디선가 제가 예상했던 방식과 다르게 캐싱이 되어있었나봄....!

 

후우 암튼 금방해결해서 다행이다

결론

1. 내가 사용하는 라이브러리가 18버전을 지원하는지 확인한다.

2. node_modules와 lock파일을 지우고 다시 설치해본다