[백엔드 - 코드를 청결하게] ESlint 사용하기, airbnb ESlint, use -f to force removal 깃 오류 해결하기

eslint를 설치해보자. 

npm install --save-dev eslint

의존성에 추가된 모습

eslint의 설정 파일인 js 파일을 생성한다. 

 

기본세팅

 

---

eslint의 기본룰 설정

 

airbnb 에서 만든 js 레포지토리가 있다. 

이를 사용해서 eslint 규칙으로 만들어서 실제 검사에 사용할 수 있다는 장점이 있다. 

이를 설치해서 사용할 수 있다.

 

npm install --save-dev eslint-config-airbnb-b
ase eslint-plugin-import

추가된 모습

---

중간 저장 사항 git에 저장하려고 했더니, 오류가 떴다.

 

git rm --cached -r -- ===========================/package-lock.json
error: the following file has staged content different from both the
file and the HEAD:
    package-lock.json
(use -f to force removal)

 

에러 해결법

 

왼쪽 세 번째 소스제어에 들어가서, 스테이징 된 파일들 이름과 같은 파일들의 수정 내용을 

그 아래 변경사항 부분에서 삭제하거나, 이전내용으로 되돌려주면 된다.

 

해결완료!

해결이 된 다음에는, 내용이 변경 된 파일에 가서 ctrl + Z 만 해주면 원상복귀 !

그럼 오류는 해결되고 내용도 그대로 쓸 수 있다.

 

아마 git에 올리려다가 취소 후 수정한 내용이 겹쳐서 오류가 뜬 것 같다.

 

---

아무튼 이어서 해보자

npm install --save-dev eslint-config-prettier

// prettier에서 설정해둔 세미콜론 사용 못하게 해둔 것을 eslint에서 사용하기 위해서 설치
// eslint가 prettier가 고친 사항에 대해서 에러를 내지 못하게 하는 것
// 이때 prettier 가 맨 뒤에 와야 잘 작동한다. 

module.exports = {
  extends: ['airbnb-base', 'prettier'],
}

 

만약 eslint가 작동할 필요가 없을 때 

이렇게 쓸 수 있다. 

 

 

no console 부분만 끄고 싶다면?

 

근데 여기서 분명 eslint를 설치했는데 강의 설명처럼 왜 오류가 안뜨나 했더니, 

검색 후에 방법을 알았다.

 

원래 이런 코드는 오류가 나야 정상이다. eslint상

ESlint 확장자 설치가 먼저 이뤄졌어야 한다. 

ESLint, Prettier 에러 종류와 해결방법 (with CRA)

설치해주자.

강의 자체는 나쁘지 않으나, 

의문점이 생기거나 오류가 자꾸 발생해서 수업을 듣는 시간이 계속 지체된다는 단점이 있다.

 

그나마 지금 나는 노드를 이 강의만 듣는 게 아니라 실제로 배우는 중이고 

코드를 고치거나 구글링에 익숙해서 해결하는것이 엄청 오래 걸리지는 않으나, 

만약 하나도 모르는 사람이 듣는다면 강의와 똑같이 흘러가지 않는 것 때문에 강의가 지체될 확률이 있어보였다.

 

그리고 따라하면서 오류 생겨서 잡고 그러다보니 나도 강의에 집중이 좀 덜 된다는 것도 한 몫한다. 음.... 

( + 끝까지 들었는데 eslint확장자에 대한 이야기가 없어서 구글링 후 해결)

 

아무튼 설치하고 나니 오류가 잘 뜬다.

필수 플러그인 깔기

npm install --save-dev eslint-plugin-node

module.exports = {
  extends: ['airbnb-base', 'plugin:node/recommended' , 'prettier'],
}

//.eslint.js

 

 

이렇게 formatting과 Linting에 이어서 airbnb Eslint 를 이용해 

최소한의 깔끔한 코드를 짤 수 있도록 환경설정을 완료했다.

 

코드를 짜는 중간중간 피드백을 주기 때문에, 

코드 청결하게 관리하기 좋다는 장점,

best Practice를 보기 좋다는 장점이 있다.