husky, lint-staged 설치, 셋팅

Song-Minhyung·2022년 7월 27일
0

Coding Convention

목록 보기
2/2

서론

이번 프로젝트를 진행하며 코드 컨벤션을 제대로 맞추려 한다.
그래서 eslint, prettier, stylelint 설정까지는 끝냈다.
근데 만에하나 코드 스타일이 맞춰지지 않은 코드가 commit 될 수도 있기 때문에
github action을 사용하려 한다.

다른 방법도 있지만 husky를 사용하는 이유는 .git 폴더는 푸시되지 않기에
다른 팀원들과 공유해 사용하기 위해서 사용해보려 한다.

설치

먼저 husky를 설치한다.

▸ npx mrm lint-staged

mrm이란 ?
오픈소스 프로젝트의 환경 설정을 동기화 하기 위한 도구이다.
이를 사용하면 lint-staged와 husky를 간편하게 설정해줄 수 있다 !!

위 명령어를 실행하면 .husky 폴더가 생기고, package.json 파일이 자동으로 설정된다.

설정

mrm이 기본 huskey의 기본 설정은 마쳤기에 lint-staged만 설정하면 된다.
타입스크립트를 사용하기에 package.json 파일을 아래처럼 수정했다.

{
  ...
  
  "lint-staged": {
    "*.{ts,tsx}": [
      "prettier --write",
      "eslint --fix"
      "stylelint --fix"
    ]
    "*.postcss-less": "stylelint --fix"
  }
  
  ...
}
profile
기록하는 블로그

0개의 댓글