인프런 커뮤니티 질문&답변

[자체해결 및 다른 수강생 분들을 위한 도움말]

Notion에 작성된 설치 코드는

pnpm add @ckeditor/ckeditor5-react^9.5.0 @ckeditor/ckeditor5-build-classic@^44.3.0 react-dropzone

으로 되어 있습니다.

저는 이슈가 있는 사항이

@ckeditor/ckeditor5-react^9.5.0

파트 였습니다.

pnpm 설치 시 버전에 ^ 표시는 그 이상 최신 버전이 있으면 설치를 하라는 의미 이고,

버전에 @ 표시를 하면 특정 버전을 정확히 지칭한다고 합니다.

CKEditor 에서 9.x 버전 중 가장 최신이 9.5.0 이라 ^을 사용하면 Error 가 발생 하는 거 같아 @로 변경하니 문제없이 설치 되었습니다.

@ckeditor/ckeditor5-react@9.5.0

저와 동일한 의존성 문제 에러를 겪으신 분들 해결에 도움이 되었으면 합니다.

제가 찾은 자료를 정리해서 참고 드리겠습니다.

CKE React 9.x - CKE Editor 44.x

CKE React 11.x - CKE Editor 46.x

9.x버전과 11.x 버전은 구조적으로 크게 차이가 있으니, 설치가 안된다고 11.x 버전을 설치하면 강의를 따라가는 데에 문제가 생길 것 같아 공유 합니다.

안녕하세요, 인프런 AI 인턴입니다. 우푸님.

현재 @ckeditor/ckeditor5-react 패키지와 다른 종속성 패키지 간의 버전 호환성 문제로 인해 설치가 진행되지 않는 상황입니다. 이런 문제는 종종 라이브러리 간의 버전 경합이나 deprecation(사용 중단) 때문에 발생할 수 있습니다.

문제 해결 방법

1. 패키지 최신 버전 확인:

   • @ckeditor/ckeditor5-react와 @ckeditor/ckeditor5-build-classic의 최신 버전을 확인하여 사용해 보세요. 각 패키지의 공식 GitHub 저장소, npm 페이지에서 최신 버전을 확인할 수 있습니다.
     

2. 패키지 제거 및 클린 설치:

   • node_modules 폴더와 package-lock.json (pnpm을 사용하는 경우 pnpm-lock.yaml) 파일을 삭제한 후, 프로젝트의 의존성을 다시 설치해 보세요.
     

   rm -rf node_modules package-lock.json
   pnpm install
   

3. 호환성 이슈 해결:

   • 만약 특정 버전이 필요하다면, package.json 파일 내에서 그 버전을 명시하여 호환성을 유지하도록 합니다.
     

4. 의존성 문제를 피하기 위한 임시 조치:

   • 심각한 문제로 보이지 않는다면, 디플리케이트 경고는 그냥 무시하고 계속 진행할 수 있습니다. 큰 문제없이 동작할 수 있으나 적절한 시점에 업데이트할 것을 권장합니다.
     

참고 링크

• Next.js 프로젝트에서 CKEditor 사용 방법
  
• 패키지 관련 : CKEditor GitHub
  

저는 질문자님의 이해를 돕고자 지식공유자님의 기존 답변을 참고하여 유사한 답변 링크를 추천해드리고 있습니다. 현재 베타 기능으로 답변이 만족스럽지 않을 수 있는 점 양해 부탁드립니다. 🙏 추가적으로 궁금한 점이 있으시면, 이어서 질문해 주세요. 곧 지식공유자께서 답변해 주실 것입니다.