commitlintによるコミットメッセージの標準化

課題

• 非統一なコミットメッセージが引き起こす
• 変更履歴の追跡困難（例: fixだけのメッセージでは何が修正されたか分かりにくい）
• コードレビュー効率の低下

https://www.conventionalcommits.org/ja/v1.0.0/

例

git commit -m "<type>[optional scope]: <description>"

commitlintについて

commitlint を使用すると、コミットメッセージが作成された直後に自動でリンティングを実行できるため、開発効率の向上とチーム協働を実現するためのベストプラクティスとなります

https://commitlint.js.org/

インストール

yarn add -D husky @commitlint/{cli,config-conventional}

主要コンポーネント

• husky: GitHook連携用ツール
• @commitlint/cli: コア実行エンジン
• @commitlint/config-conventional: デフォルト設定

動作原理図解

1. Git Hook（commit-msg フック）が Husky によってトリガーされ、
2. Husky が commitlint CLI を呼び出してコミットメッセージを検証し、
3. その検証結果が出力される

GitHook連携

echo "npx --no -- commitlint --edit \$1" > .husky/commit-msg

project
├── .husky/
│    └──commit-msg
└── ...

commitlintの設定ファイル作成

echo "export default { extends: ['@commitlint/config-conventional'] };" > commitlint.config.mjs

project
├── commitlint.config.mjs
└── ...

commitlintの基本設定

commitlint.config.mjs

export default {
  extends: ["@commitlint/config-conventional"],
  // 設定内容
};

https://commitlint.js.org/reference/configuration.html#configuration-object-example

テスト

git add .
git commit -m "xxxxxxx"
yarn run v1.22.19
$ commitlint --edit .git/COMMIT_EDITMSG
⧗   input: xxxxxxx
✖   subject may not be empty [subject-empty]
✖   type may not be empty [type-empty]

✖   found 2 problems, 0 warnings
ⓘ   Get help: https://github.com/conventional-changelog/commitlint/#what-is-commitlint

error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
husky - commit-msg hook exited with code 1 (error)

プラグインを使用し、出力メッセージを日本語で表示する

const プラグイン = {
  rules: {
    "ルール名": ({ コミット構造 }) => {
      if (条件) return [false, "日本語の出力メッセージ"];
      return [true];
    },
  }
}