Okarin note

頭の整理もかねて色々と書いていきます

Commitizenとcz-emojiを使っておしゃれにコミットする

コミットするときにプレフィックスだとかで色々迷っていたんですが、便利なツールがあることを知ったので使い始めました。
npmのパッケージなのでNode.jsが必要です。

環境

  • Windows + WSL2(ディストリ: Ubuntu20.04)
  • Node.js v16.15.1

必要なパッケージのインストール

npm i commitizen cz-emoji

github.com

github.com

設定ファイルを作る

ホームディレクトリに「.czrc」を作ります。

↓私の設定です。
自由にカスタマイズもできるのでこれじゃ嫌だ!って方はいろいろ変えてみて下さい。

{
    "path": "cz-emoji",
    "config": {
        "cz-emoji": {
            "subjectMaxLength": 72,
            "skipQuestions": ["scope"],
            "types": [
                {
                    "name": "feat",
                    "code": "feat: :+1:",
                    "emoji": "👍",
                    "description": "Feature (実装)"
                },
                {
                    "name": "fix",
                    "code": "fix: :bug:",
                    "emoji": "🐛",
                    "description": "Fix (修復)"
                },
                {
                    "name": "wip",
                    "code": "wip: :construction:",
                    "emoji": "🚧",
                    "description": "WIP (工事)"
                },
                {
                    "name": "chore",
                    "code": "chore: :paperclip:",
                    "emoji": "📎",
                    "description": "Chore (雑務)"
                },
                {
                    "name": "style",
                    "code": "style: :sparkles:",
                    "emoji": "✨",
                    "description": "Style (美観)"
                },
                {
                    "name": "docs",
                    "code": "docs: :notebook:",
                    "emoji": "📓",
                    "description": "Documents (文書)"
                },
                {
                    "name": "perf",
                    "code": "perf: :zap:",
                    "emoji": "⚡",
                    "description": "Performance (改善)"
                },
                {
                    "name": "refactor",
                    "code": "refactor: :bulb:",
                    "emoji": "💡",
                    "description": "Refactoring (改築)"
                },
                {
                    "name": "test",
                    "code": "test: :100:",
                    "emoji": "💯",
                    "description": "Test (試験)"
                },
                {
                    "name": "release",
                    "code": "release :tada:",
                    "emoji": "🎉",
                    "description": "Release (公開)"
                }
            ]
        }
    }
}

使ってみる

以下のコマンドを実行する。
git addでステージングしていないと失敗するので何かしらステージしてあげてください。

git cz

設定が正しければ以下のようにコンソールに出力されるはずです。
矢印でどのプレフィックスを付けるか選べます。
決まったら

cz-cli@4.2.4, cz-emoji@1.3.1

? Select the type of change you're committing: (Use arrow keys or type to search)
❯ feat      👍  Feature (実装) 
  fix       🐛  Fix (修復) 
  wip       🚧  WIP (工事) 
  chore     📎  Chore (雑務) 
  style     ✨  Style (美観) 
  docs      📓  Documents (文書) 
  perf      ⚡  Performance (改善) 

実行した結果です。
プレフィックスを選んだら、タイトル決めて、詳細書いて終わりです。
issueとかも選択すれば閉じることが出来るのでそこは自由に使ってみましょう。

cz-cli@4.2.4, cz-emoji@1.3.1

? Select the type of change you're committing: refactor  💡  Refactoring (改築)
? Write a short description: refactor: :bulb:  git cz test
? Provide a longer description: test desctiption
? A BREAKING CHANGE commit requires a body. Please enter a longer description of the commit itself:
 
? List any issue closed (#1, #2, ...): 
[main ac3fa4b] refactor: :bulb:  git cz test
 1 file changed, 1 insertion(+)

後はpushして終了です!
これでおしゃれにコミットができるぞい!