codestates / codestates/Lumiere

[에러 핸들링] ESLint + Prettier 설정시 Could not resolve dependency 발생하는 현상

Open
#91 0 comments 0 reactions 2 assignees Claimed by @devTiana View on GitHub
Completed Error
Dominant language
TypeScript
Stars
7
Forks
4
PR merge metrics
No merged PRs in 30d

Description

> 해결된 에러라면 라벨에 'Complete' 를 달아주세요.
> 미해결된 에러라면 라벨을 'In progress' 로 변경해주세요.

### 어떤 에러인가요?
- ESLint Prettier 설정중 npm install에서 ERR가 발생하는 현상
-npm i -D eslint prettier
**npm i -D @typescript-eslint/eslint-plugin @typescript-eslint/parser** <-- 여기에서 에러
npm i -D eslint-config-airbnb
npm i -D eslint-config-prettier eslint-plugin-prettier
npm i -D eslint-plugin-react eslint-plugin-react-hooks
npm i -D eslint-plugin-jsx-a11y eslint-plugin-import

해당 커맨드라인 참고 레퍼런스 : https://velog.io/@kmlee95/React-Typescript-eslint-prettier%EC%84%A4%EC%A0%95

### 에러 메시지

```bash
$ 터미널의 에러 코드를 여기 넣어주세요.
➜ client git:(dev) ✗ npm i -D @typescript-eslint/eslint-plugin @typescript-eslint/parser
npm ERR! code ERESOLVE
npm ERR! ERESOLVE could not resolve
npm ERR!
npm ERR! While resolving: client@0.1.0
npm ERR! Found: @typescript-eslint/eslint-plugin@4.33.0
npm ERR! node_modules/@typescript-eslint/eslint-plugin
npm ERR! peer @typescript-eslint/eslint-plugin@"^4.0.0" from eslint-config-react-app@6.0.0
npm ERR! node_modules/eslint-config-react-app
npm ERR! eslint-config-react-app@"^6.0.0" from react-scripts@4.0.3
npm ERR! node_modules/react-scripts
npm ERR! react-scripts@"4.0.3" from the root project
npm ERR! peerOptional @typescript-eslint/eslint-plugin@">= 4" from eslint-plugin-jest@24.7.0
npm ERR! node_modules/eslint-plugin-jest
npm ERR! peerOptional eslint-plugin-jest@"^24.0.0" from eslint-config-react-app@6.0.0
npm ERR! node_modules/eslint-config-react-app
npm ERR! eslint-config-react-app@"^6.0.0" from react-scripts@4.0.3
npm ERR! node_modules/react-scripts
npm ERR! react-scripts@"4.0.3" from the root project
npm ERR! eslint-plugin-jest@"^24.1.0" from react-scripts@4.0.3
npm ERR! node_modules/react-scripts
npm ERR! react-scripts@"4.0.3" from the root project
npm ERR! 2 more (react-scripts, the root project)
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! dev @typescript-eslint/eslint-plugin@"*" from the root project
npm ERR!
npm ERR! Conflicting peer dependency: @typescript-eslint/parser@5.5.0
npm ERR! node_modules/@typescript-eslint/parser
npm ERR! peer @typescript-eslint/parser@"^5.0.0" from @typescript-eslint/eslint-plugin@5.5.0
npm ERR! node_modules/@typescript-eslint/eslint-plugin
npm ERR! dev @typescript-eslint/eslint-plugin@"*" 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 /home/junghunkim/.npm/eresolve-report.txt for a full report.

npm ERR! A complete log of this run can be found in:
npm ERR! /home/junghunkim/.npm/_logs/2021-11-30T09_46_37_633Z-debug.log
```

### 에러 핸들링 방법

- 핸들링 방법에 대해서 간단하게 기록해보세요.
- 최초 typescript npm install시 하기 명령어를 적용하여 install 하게되면typescript-eslint가 자동으로 설치되게 되는데 위에 참고 레퍼런스에서 가이드한 npm i를 할경우 typescript-eslint를 6버전을 새롭게 깔려고 하다보니 npm install에서 에러가 발생하는 현상
- 해결은 해당 npm install을 진행하고 않고 스킵

```js
- npx create-react-app 프로젝트이름 --template typescript
- npm install typescript @types/node @types/react @types/react-dom @types/jest
```

### 에러 핸들링을 위해 참고한 레퍼런스 링크

[링크]()

Contributor guide

No contributing guide indexed for this repository

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.