[트러블슈팅] shadcn/ui DatePicker 설치 시 React 19 충돌 해결법

NextJs 토이프로젝트 진행 중 발생한 트러블 슈팅

라이브러리 버전이 react 환경에 맞지 않을 때, 귀찮다고 그냥 넘어가서 발생한 문제

앞으로 --legacy-peer-deps에 의존하지 말고 발견 즉시 해결하자

 

1. 문제

npx shadcn@latest add calendar

 

shadcn에서 dayPicker UI 사용 시 사용하는 명령어

 

하지만 내부적으로 react-day-picker@8.10.1이 설치되어
React 19 환경에서 의존성 충돌(ERESOLVE 에러)이 발생한다.  

 

2. 해결

처음에는 --legacy-peer-deps로 해결하려고 했지만, 다른 라이브러리 설치 시 거슬리기 시작하여 위와 같은 원인을 발견

npm install react-day-picker@^9.0.0

 

9 버전에서 React 19 환경에 대응했다는 토픽을 발견하여 업데이트하였다. (latest 사용해도 된다)

 

그 뒤 

https://ui.shadcn.com/docs/components/calendar

Calendar

upgrade guide 참고하여 진행하면 된다

3. 참고

react-day-picker 공식 React 19 대응 논의