[TIL] 3주차 - 6. husky 설치 및 셋팅

Husky

 

husky란 소스코드를 git에 commit 하기 전에,

기존의 규칙(typescript, eslint, prettier 등)을 지켜가면서

코딩을 진행하였는지 검증해 주는 도구입니다.

커밋하기 전에 허스키로 명령어를 가로채고 규칙에 어긋나는 코드가 있다면 commit을 강제로 거절합니다.

따라서, 실무적으로 더 안정적인 협업을 할 수 있습니다.

 

( 쉽게 말해서 그냥 라이브러리 설치하는 것인데

커밋 하기 전에 허스키로 명령어를 가로채고

eslint가 제대로 무사한지 보고 안무사하면

커밋을 못하게 하는 방식입니다. )

 

Husky 설치 및 셋팅

1. husky 설치

npm에 들어가 husky를 검색해줍니다.

2022년 1월 25일 기준 가장 안정되어 있는 버전은 4이므로

버전4로 설치 받도록 하겠습니다.

 

버전4 라는 뜻으로 @4를 붙여서 

 

yarn add husky@4 --dev

 

를 쳐줍니다.

 

설치가 잘 됐다면  package.json에서 확인

 

 

---

이때, error가 났다면?

아래글을 참고해주세용.

https://fe-dev94.tistory.com/30

[husky error] yarn : 이 시스템에서 스크립트를 실행할 수 없으므로 C:\Users\Jina Kim\AppData\Roaming\npm\yarn.p

 

2. lint-staged 설치

커밋하기 전 실행해줄 lint-staged를 설치합니다.

 

yarn add lint-staged

 

 

3. package.json 에서 설정하기

 

설치를 마쳤다면 package.json 으로 갑니다.

( package.json에서 dependencies 는 설치된 목록들이고

scripts는 실행 명령들이 있습니다. )

 

package.json 파일에 husky와 lint-staged 내용을 작성해줍니다.

{
	...
	...
"devDependencies" : {
	...
	...
},
"husky": {
    "hooks": {
      "pre-commit" : "lint-staged"
    }
  },
"lint-staged": {
	"**/*.{ts,tsx}" : [
			"npx eslint '**/*.{ts,tsx}'"
	  ]
	}
}

 

 

이제 eslint 규칙에 어긋나는 코드가 있는 파일을 커밋하려고 하면 커밋이 되지 않습니다.