자바스크립트
husky를 이용하여 push, commit 전 테스트 자동화
YG - 96년생 , 강아지 있음, 개발자 희망
2023. 12. 2. 12:10
Husky를 이용하여 테스트 자동화 하는 이유
깃 action에서도 테스트 자동화를 할 수 있지만 월 2,000분만 무료로 제공하기 때문에 잦은 PR을 올리거나 테스트 개수가 많아졌을 때 비용이 들 수 있습니다. 그래서 push 혹은 commit 하기 전 로컬에서 테스트가 실패하거나 불필요한 코드가 같이 PR에 올라가는 지 확인하는 것이 좋다고 생각이 들었습니다.
설치
npm install husky --save-dev
npm install --save-dev lint-staged
적용 방법
package.json
lint-statged를 설정해 줍니다.
"lint-staged": {
"*.{js,jsx,ts,tsx}": [
"eslint --fix",
"prettier --write"
]
}
그리고 postinstall을 추가해 줍니다.
"postinstall": "husky install .husky"
. husky/pre-commit
. "$(dirname -- "$0")/_/husky.sh"
npx lint-staged
. husky/pre-push
. "$(dirname -- "$0")/_/husky.sh"
npm run test
에러 1
에러 코드
hint: The '.husky/pre-commit' hook was ignored because it's not set as executable.
hint: You can disable this warning with git config advice.ignoredHook false.
해결방법
chmod ug+x .husky/*
에러 2
원인
test에 jest --watch 설정이 되어있어서 허스키에서 테스트를 한 후 종료가 되지 않는 것이 원인이었습니다.
해결방법
test:ci라는 명령어에서는 --watch 옵션을 해제하고 pre-push에서 npm run test를 npm run test:ci로 변경해 주었습니다.
. husky/pre-push
. "$(dirname -- "$0")/_/husky.sh"
npm run test:ci
에러 3
원인
lint-staged 설정에서 eslint --fix라는 명령어가 올바르게 동작하지 않았는데 알고 보니 경로를 틀리게 설정했었다.
./ 을 없애고 나서야 제대로 동작했다.
"lint-staged": {
"./*.{js,jsx,ts,tsx}": [
"npx eslint --fix .",
"npx prettier --write ."
]
}
해결방법
"lint-staged": {
"*.{js,jsx,ts,tsx}": [
"eslint --fix",
"prettier --write"
]
}
push일 때 테스트를 하는 사진
commit 할 때 eslint --fix와 prettier write를 하는 사진
참고자료