[ESLint] The react-srcipts package provided by Create React App requires a dependency :: 의존성 문제

의존성 에러 해결

에러 발생

이런 오류가 떴다.

CRA가 제공하는 react-scripts 패키지가 eslint 6.6.0 버전에 의존하는데, 7.2.0 버전을 설치해서 그렇다고 한다.

저 밑에 나오는 해결방법이 있는데, 따라해도 해결되지 않는다 ㅎ... 저번에도 같은 문제로 속썩여서 이번엔 제대로 각잡고 해결해보려고 한다.

이유 발견

이유는 구글링하다가 발견했는데(https://github.com/wesbos/eslint-config-wesbos/issues/17) , react-scripts의 eslint 의존성 버전과 airbnb linting에서의 eslint 의존성 버전이 일치하지 않아서 나오는 문제였다.

뻘짓

그래서 일단 react-scripts version을 `npm view react-scripts version`으로 확인해보니 3.4.0 이었다.

최신 버전인 react-scripts 4.0.0으로 설치해주기 위해 `npm install --save react-scripts@^4.0.0`을 실행했다.

이 오류 이제 그만 보고싶다..

그랬더니 이제 eslint 버전 7.11.0가 필요하다고 한다.

실제로 node_modules 폴더에서 react-scripts를 찾아서 package.json의 의존성(dependency)을 확인해보면 eslint 7.11.0 버전을 설치하라고 되어있다.

따라서, eslint 7.11.0 버전을 설치하려고 `npm install --save eslint@^7.11.0`해보지만, 계속 똑같은 오류가 뜬다.

 

나중에 보니 상위 폴더에 설치된 eslint 버전을 받아오고 있다. 따라서, 상위 폴더에 있는 eslint도 `npm uninstall --save eslint`로 삭제한다. 하지만 계속 똑같은 오류가 뜬다.

 

 

해결 방안

• uninstall 명령어로 react-scripts와 eslint를 상위폴더와 해당 폴더에서 모두 지운다.

• package-lock.json을 삭제한다.

  • 그렇지 않으면 모듈 간의 의존성때문에 다음과 같은 오류가 계속 발생한다.

 

끝없는 오류

 

 

• package.json에 필요한 모듈 정보를 저장한다.

  • npm install --save 로 라이브러리를 설치하면 package.json에 등록된다.

  • react-scripts는 4.0.0 버전, eslint는 7.11.0 버전을 설치한다.

  • 나중에 오류날 것을 대비해서 @babel/core 7.12.3 버전도 설치한다. (react-scripts에서 필요로 한다.)

    • node_modules 폴더의 react-scripts에서 package.json 파일의 의존성을 확인하면 @babel/core 버전을 확인할 수 있다.

• npm install

• npm start

 

결론

원하는 모듈들의 의존성 여부를 조사한 후, 해당 버전을 --save로 깔아서 package.json에 등록되게 해준다.

이 과정에서 다른 모듈들이 지정해둔 의존성과 맞지 않아 깔리지 않을 수도 있으므로 package-lock.json 파일은 삭제한 후 진행한다.