[FE/Git] husky

[FE/Git] husky

• https://typicode.github.io/husky/
• Ver. 9.1.7 기준
• git commit 또는 push 전 특정 명령어가 실행되도록함
• ex) commit 전 lint 또는 prettier 실행하여 코드 검증/포맷 통일
• 추가 참고: lint-staged

작업 순서

1. 설치
2. 기본 설정
3. 주의 사항

1. 설치

#  패키지 설치
npm i -D husky

• package.json에 아래 명령어 추가됨
• 자동설치 기능이 삭제됨 > 수동 설치
  https://blog.typicode.com/posts/husky-git-hooks-autoinstall/

// package.json
{
    ...
    "prepare": "husky"
}

• prepare 실행
• ./.husky/_ 폴더와 husky 관련 파일이 생성됨
• package.json에 이미 husky가 정의 된 경우 npm install 실행시 자동 설치됨

  npm run prepare

2. 기본 설정

• .git 폴더와 package.json 위치가 다른 경우 주의 사항 참고!!!!!!!!!!!

1. 초기화

husky 초기화 명령어를 실행

npx husky init

.husky/pre-commit 생성 확인

2. 실행

• git commit시 실행할 명령어 추가 - pre-commit 파일
• .git 폴더와 프로젝트의 package.json의 경로가 같은 경우임!!

# ./husky/pre-commit
# 실행 명령어 추가하면 git commit 실행시 prettier가 실행되어 파일 모맷 수정 후 커밋됨
npx prettier --cache --write .
git update-index --again

3. 주의 사항

1 .git폴더와 package.json 이 같은 위치가 아닌 경우(1)

• https://typicode.github.io/husky/how-to.html#project-not-in-git-root-directory

├── .git/
├── backend/  # No package.json
└── frontend/ # Package.json with husky

• 아래와 같이 경로 수정

 {
    ...
    //"prepare": "husky"
    "prepare": "cd .. && husky frontend/.husky"
 }

# prepare 경로 수정시 prepare 재 실행 
# 경로 수정된 상태에서 npm install 한경우 재실행 불 필요
npm run prepare

2 .git 와 package.json 이 같은 위치가 아닌 경우(2)

• 위와 같이 prepare의 명령어를 수정 한 경우
• 아래의 prettier 명령어 실행 경로 위치가 달라져야 함

• prepare를 수정 하지 않은 경우 pre-commit

npx prettier --cache --write .
git update-index --again

• prepare를 수정 한 경우

npx prettier --cache --ignore-path ./frontend/.prettierignore --write ./frontend
git update-index --again