그전 포스트에 이어서 이번엔 gitmoji를 포함한 형태로 바꿔보자

gitmoji

https://gitmoji.dev/

gitmoji를 왜 사용할까

• 글씨보다는 그림의 형태가 직관적으로 어떤 커밋인지 한눈에 알기 편하기 때문이고
• 귀여움이 더 큰거 같기도..?

커밋에 필수적으로 포함할 요소는 아닌 선택사항이지만 도입해보니 귀엽다!?

홈페이지에 각 이모지와 설명이 있지만 권장사항이지 꼭 저 용도로 쓸 필요는 없다

gitmoji를 포함한 형태를 검증하기

commitlintrc파일을 다음과 같이 수정한다

{
  "extends": [
    "@commitlint/config-conventional"
  ],
  "parserPreset": {
    "parserOpts": {
      "headerPattern": "^(?<type>.+):\\s(?<subject>.+)$",
      "headerCorrespondence": [
        "type",
        "subject"
      ]
    }
  },
  "rules": {
    "type-enum": [
      2,
      "always",
      [
        "✨ feat",
        "🐛 fix",
		...
      ]
    ]
  }
}

하단의 블로그를 참고함
https://jjang-j.tistory.com/121

관련 Tool

그래서.... 매번 커밋메시지를 작성할때마다 gitmoji를 복붙해오기엔 아무래도 당연히 불편할 것이다

이를 위해 나온 관련 Tool 중 gitmoji client를 사용해보자

Gitmoji client

https://github.com/carloscuesta/gitmoji-cli

npm i -g gitmoji-cli

git add 후 커밋을 할때 gitmoji -c 를 입력하면
다음과 같이 순차적으로 gitmoji -> commit title -> commit message 내용을 입력하여 실행되며 commit이 된다

gitmoji를 검색하는 기능이 이 툴에서 가장 유용하다

이쯤이면 다 됐다고 생각했는데... 확정된 컨벤션에 어긋나는 상황이 발생하는데..

문제 발생

현재 합의된 convention은
✨ feat: 로그인 함수 추가와 같은 형태인데
Gitmoji client로 입력 시, 기본적으로 commit title(message)가 uppercase로 고정되어 있다

나는 feat으로 시작하고 싶은데... gitmoji clinet가 무조건 Feat으로 입력하게 해줌ㅎ..
그렇다면... gitmoji client활용을 포기해야할까?

문제 해결

공식 git을 찾아보니 관련 config파일을 따로 작성할 수 있었다.

https://github.com/carloscuesta/gitmoji-cli

그래서

1. 글로벌 형태로 깔린 gitmoji client를 언인스톨
2. --save -dev로 개발환경에 gitmoji client를 설치
3. 또한, .gitmojirc.json를 별도로 작성해서 필요한 조건을 설정했다.
   • 즉, capitalizeTitle을 false로 바꾸면 된다

어차피 프로젝트에 참여할 팀원들이 전부 공통적으로 동일한 config를 설정할 필요가 있으므로 글로벌 환경이 아닌 dev환경으로 옮겼다

대신 이젠 npx gitmoji -c 형태로 gitmoji client을 실행한다

결과

다음과 같이 F가 아닌 소문자 f형태로 시작하여 commit message를 작성할 수 있다.

위에 여러 eslint 및 prettier를 검사한 메시지가 뜨고 다 이렇게 컨벤션을 통과했다는 메시지가 나온다

최종 폴더구조는 다음과 같다

eslintcache파일은 처음부터 존재하지는 않고 관련 --cache설정에 의해 검사하다보면 자동생성된다