inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

React로 NodeBird SNS 만들기

1-2. next와 eslint 설치하기

vscode 에서 cannot find eslint-plugin-react 에러

8185

가다머

작성한 질문수 11

0

package.json 에서 eslint, plugin들도 확실히 다 깔려있는데 왜 이런지 모르겠습니다.

vscode extension으로 eslint도 깔아봤고 다시시작도 해봤습니다.

react javascript

답변 4

6

고얀

저도 eslint가 적용이 안되는 문제때문에 해맸는데 jiyeol lee 님의 힌트를 받아서 더 찾아보니 아래처럼 settings.json 을 수정하면 된다고 하여 해보니 잘 되네요!

"eslint.workingDirectories": [
    { "mode": "auto" }
],

2

Jiyeol Lee

https://github.com/microsoft/vscode-eslint/issues/696#issuecomment-512252381

저도 같은 문제로 삽질을 오래했는데 어떻게 해결은 한 것 같습니다. 저는 위 링크로 들어가면 보이는 코멘트를 참고했구요.

어쩌다보니 vscode-eslint 깃허브 레퍼지토리에 올라온 이슈까지 참고했네요. Eslint6로 업그레이드되면서(참고로 제로초님이 이 강의를 만드실때는 5.16버전이었습니다.)와 VS code의 eslint extension과의 호환 문제가 있었던 것 같아요. 6.4로 업그레이드 된지는 진짜 얼마 안 됬네요.

Nodebird 프로젝트 root 디렉토리가 아닌 front 폴더에 eslintrc 파일이 위치하고 있는 부분이 문제가 되는 것으로 보입니다. (사실 저도 잘 모르겠습니다... 영어로 다 보는게 쉽지도 않네요. 관심 있으시면 제가 첨부한 링크에 수많은 사람들이 이슈 코멘트를 최대한 보시면 될 거 같아요)

간단히 말씀드리면 vscode settings.json에 "eslint.workingDirectories": ["./front"] 이렇게 추가하고 나니 eslint 6.4 버전에서도 vscode eslint extension은 잘 동작하는 것 같습니다.

Nodebird 프로젝트가 front, back으로 나누어져있는데 저는 강의 극초반이라 어떻게 될지 모르겠지만, back 폴더 내에서 아마도 또 따로 eslintrc 파일을 나중에 생성하게 되면 "./back" 경로도 또 추가해주면 될 거 같아요. 

아직 코알못이라 저랑 똑같이 하셔도 해결될지 모르겠지만, 답글 남겨봅니다. 아니면 이미 해결하셨길 바랍니다 :)

**그냥 eslint 5.16으로 다운그레이드만 해도 해결이 되는 지 모르겠습니다. 잘 기억이 안 나네요. 워낙 정신없이 이래저리 실험을 했어서... 단순히 다운그레이드로 해결되시면 그것도 좋은 방법이겠죠.

0

전민우

전역으로 설치해도 아래와 같은 문제가 계쏙 나옵니다 .eslintrc 파일에 plugins설정에서 import 를 지우면 react-hooks로 이름만 바껴서 똑같은 오류가 발생하는데 원인이 뭘까요...

Failed to load plugin 'import' declared in 'front/.eslintrc': Cannot find module 'eslint-plugin-import'
Require stack:
- /Users/^^/Documents/vscode_workspace/react-nodebird/__placeholder__.js
Happened while validating /Users/^^/Documents/vscode_workspace/react-nodebird/front/components/LoginForm.js
This can happen for a couple of reasons:
1. The plugin name is spelled incorrectly in an ESLint configuration file (e.g. .eslintrc).
2. If ESLint is installed globally, then make sure 'eslint-plugin-import' is installed globally as well.
3. If ESLint is installed locally, then 'eslint-plugin-import' isn't installed correctly.

Consider running eslint --debug /Users/^^/Documents/vscode_workspace/react-nodebird/front/components/LoginForm.js from a terminal to obtain a trace about the configuration files used.

0

제로초(조현영)

npm i -g로 전역 설치도 한 번 해보세요

next 10 이상에서는 redux dev tool 구동이 안되나요?

0

272

1

세션 갱신 문의 건

0

484

7

배포 진행 후 Highlight updates components render 표시

0

445

1

똑같은 기능을 하는 테이블

0

448

4

관계형

0

312

2

프론트 서버를 이용하지 않는경우

1

299

3

인피니트 스크롤링 사용시 오류

0

278

0

계속 이런에러가 떠서 해결하기는 했는데 어떤 의미인지 모르겠습니다.

0

435

2

req.user가 언제 생성되나요??

0

330

2

Cannot read property 'id' of null 에러

0

333

1

리트윗한 게시글 불러오는 sequelize

0

252

1

result.data에서 images인 이유

0

281

2

takeLatest에 대한 질문입니다.

1

342

2

프론트에서 express를 사용하지 않을때 동적라우팅

0

501

6

getInitialProps가 클라이언트에서 수행되는 이유?

0

258

1

리로드하면 팔로우 언팔로우 값이 초기화 되는 문제입니다.

0

445

2

스타일드 컴포넌트와 className을 통한 스타일 적용의 차이에 대해 궁금합니다

0

585

2

할인 쿠폰 사용이 안되는되요 (848-f9af83f183e3)

0

365

1

nodejs mvc 패턴

0

976

4

사용하고 보니, 람다 구성이 궁금합니다!

0

266

1

제로초님

0

445

1

새로고침 로그인 풀림 문제.

0

247

1

안녕하세요. 강의 너무 감사합니다

0

157

1

제로초님

0

170

1