husky + lint-staged : 커밋 전 eslint, prettier 검사
husky + lint-staged를 이용해 eslint와 prettier가 적용 됐을 때만 커밋 가능하게 만들것이다~ 그전에 husky와 lint-staged를 알아보자 # Husky Automatically lint your commit messages,code, and run tests upon committing or pushing.
baeritas.tistory.com
Husky 2탄! 설치 방법은 위 글을 보면 되고 버전은 9!
Husky는 git hook 기능을 편리하게 사용할 수 있도록 도와준다
Git Hooks란? 어떤 이벤트가 생겼을 때 자동으로 특정 스크립트를 실행하도록 할 수 있다.
이번에 할 것은 commitizen !! + commitlint
commit convention을 통일하기 좋은 라이브러리다
commitizen을 실행하면 이런 창이 뜬다
기능마다 설명까지 너무 좋아 ~~~!!
기능 선택하면 커밋 메세지를 작성 할 수 있다
이렇게 모든 개발자들의 커밋 메세지가 통일된다면 변경내역을 파악하거나 추적하기 편할 것 같다
husky를 이용해
1. git commit를 치면 바로 commitizen이 실행 되도록 할 것이다
2. commitlint도 설정해서 정해진 커밋 컨벤션을 지키지 않으면 커밋이 되지 않도록 할 것이다
yarn add commitizen --dev
yarn add -D @commitlint/cli @commitlint/config-conventional
commitizen과 commitlint를 설치한다
https://github.com/conventional-changelog/commitlint/tree/master/%40commitlint/config-conventional
어떤 커밋 컨벤션을 따르는지는 위 페이지에서 확인 할 수 있다
echo "exec < /dev/tty && yarn git-cz --hook || true" > .husky/prepare-commit-msg
git commit을 쳤을 때 commitizen이 실행되게 하려면 터미널에 해당 명령어를 쳐주면 된다
아니면 직접 .husky 폴더 밑에 prepare-commit-msg 파일 만들고 exec < /dev/tty && yarn git-cz --hook || true 치는 것도 된다.
처음에 pre-commit 단계에서 저 명령어를 쳤어서
commitizen 실행했는데 또 빈 commit 메세지 입력 창이 떠서 당황
알고보니 prepare-commit-msg 단계에 실행해야 했다
pre-commit은 커밋전에 실행 prepare-commit-msg 커밋 메시지를 생성하고 나서 편집기를 실행하기 전에 실행된다.
echo "npx --no-install commitlint --edit $1" > .husky/commit-msg
이건 커밋메세지가 컨벤션을 잘 따랐는지 확인하는 단계!
commit-msg 단계에서는 스크립트가 0이 아닌 값을 반환하면 커밋되지 않는다.
컨벤션 안지키면 위와 같은 오류가 나며 커밋 실패 !
vs code 소스제어 탭에서 커밋컨벤션을 지키지 않은 채 커밋을 해버려도 commitlint가 작동해서 커밋이 안된다 ~.~
husky + lint-staged + commitizen + commitlint 최종완성본 ~
git commit 하면
1. lint, prettier 검사
2. commitizen 실행해서 커밋 메시지 작성
3. commitlint로 커밋 메시지 컨벤션 검사
팀 프로젝트에 적용하자고 제안을 해보고 싶은데 기존 프로젝트는 내부망에 패키지 새로 까는게 너무 힘든 일이라 새 프로젝트 들어가면 말해봐야겠다잉
'Etc.' 카테고리의 다른 글
[NGINX] 간단한 설정과 auth request (0) | 2024.09.10 |
---|---|
husky + lint-staged : 커밋 전 eslint, prettier 검사 (0) | 2024.02.28 |
[GitLab] CI/CD 오류 : There has been a missing dependency failure (0) | 2024.02.28 |
[SonarQube] + SonarScanner : mac 설정 및 분석 (0) | 2024.02.26 |