[React] 모듈 설치가 안될 때(ERESOLVE) 해결하기 || 의존성이 대체 뭐길래..

의존성 에러 해결해보자 

 

fade-in 애니메이션을 넣으려고 하는데 

react-reveal을 사용하면 된다는 글을 보고 설치를 하려고 했더니

npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: corn-cafetimes@0.1.0
npm ERR! Found: react@18.2.0
npm ERR! node_modules/react
npm ERR!   react@"^18.2.0" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react@"^15.3.0 || ^16.0.0" from react-reveal@1.2.2
npm ERR! node_modules/react-reveal
npm ERR!   react-reveal@"*" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR!
npm ERR! See C:\Users\LG\AppData\Local\npm-cache\eresolve-report.txt for a full report.

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\LG\AppData\Local\npm-cache\_logs\2022-10-29T12_14_10_660Z-debug.log

이렇게 의존성 에러가 발생했다. 의존성만 생각하면 화가나는데 대체 의존성이 뭐냐?부터 생각해보자면

의존성(Dependency)이란?

객체의 세계에서 협력은 필수적이며, 객체가 협력한다는 것은 객체 간의 의존성이 존재한다는 것이다. 여기서 의존성이란 파라미터나 리턴값 또는 지역변수 등으로 다른 객체를 참조하는 것을 의미한다.

---

npm이 제공하는 의존성은 다음과 같다.

• dependencies
  • 프로젝트에서 실제로 의존하고 호출하는 의존성들
• devDependencies
  • 개발할 때만 의존하는 의존성들(예를 들면 코드 포맷팅을 예쁘게 해주는 라이브러리)
• peerDependencies
  • 내 패키지가 다른 패키지로부터 직접 불려지는(require) 것은 아니지만 특정 버전의 패키지와 호환된다는 것을 명시
  • 즉, 내가 다른 패키지의 특정 버전과 호환된다는 것을 뜻한다
  • 자세한 내용은 여기 참고
• optionalDependencies
  • 선택적인 의존성으로 없거나 설치에 실패해도 npm 패키지 설치 과정이 중단되지 않아 다른 라이브러리 설치에 영향을 주지 않는 의존성들
• bundledDependencies
  • 내 패키지와 함께 제공되는 일련의 패키지들. 타사 라이브러리가 NPM에 없거나 일부 프로젝트를 모듈에 포함하려는 경우 사용할 수 있다.

이런 에러는 peerDependencis로 라이브러리가 제공하는 리액트 버전과 내가 쓰고 있는 리액트 버전이 맞지 않아 난 에러이다.

---

해결 방법

 

이럴 때는 이런 의존성을 무시하고 계속 설치해주는 방법이 있는데, 내가 사용할 수 있는 방법은 두가지가 있었다.

 

1. npm install [라이브러리 명] --force : 로컬에 다운로드 복제본이 존재하더라도 다시 온라인에서 다운로드 받는다.

2. npm install [라이브러리 명] --legacy-peer-deps: peerDependencies를 무시한다.

 

이 방법 중 npm install react-reveal --force로 설치를 하였다.

 

 

이 글은 아래 블로그를 참고하여 만들어 졌습니다.

https://www.korecmblog.com/ERESOLVE-unable-to-resolve-dependency-tree/

https://mangkyu.tistory.com/226

[OOP] 의존성(Dependency)이란? 컴파일타임 의존성과 런타임 의존성의 차이 및 비교

ERESOLVE unable to resolve dependency tree 해결하기