VS Code + GitHub Copilot 環境でも git commit しちゃうんだな、これが

VS Code でコミットするときに GitHub Copilot を使っていると コミットメッセージを生成してくれたりします。

図 1 コミットメッセージを Copilot で生成

英語苦手な自分からすると「マジうれしいんですけど」という感じなのですが、コミットメッセージはできればエディターで記述したいと考えてしまいます。

そこで今回は「コミットメッセージをエディターで編集する利便性」を維持しつつ、「GitHub Copilot による生成機能もできるだけ利用しよう」という内容のメモになります。

• 2024-01-29 更新: コミットメッセージ編集時に diff を表示する簡単な方法をコメントで教えていただいたので変更しました

VS Code のエディターでコミットメッセージを記述するとは

VS Code でコミットメッセージを記述する方法としてはソース管理タブの利用が一般的かと思われます。

図 1-1 ソース管理タブのフィールドから普通に入力

一方で上記とは別に、コミット用のコマンドを実行しエディターの中で記述する方法もあります。

• ターミナルから git commit を実行する
• コマンドパレットで Git: Commit を実行する

こちらはコマンドを別途実行する必要がありますが、コミットメッセージ(.git/COMMIT_EDITMSG)をエディタータブで編集するので、エディターならではの編集支援を受けられます。

図 1-2 エディターで入力(シンタックスハイライトや文字数のガイドルーラーが表示される)

また、コミットメッセージにも言語 ID が割り当てられているので、キー配列や拡張機能によるカスタマイズも適用しやすくなっています。

私は「Markdown として表示するとどう見える？」が気にときがあるので、以下のようなショートカットを登録しています。

リスト 1-1 ctrl + shift + v で Markdown プレビューを開くキーボードショートカット

{
  "key": "ctrl+shift+v",
  "command": "markdown.showPreview",
  "when": "!notebookEditorFocused && editorLangId == 'git-commit'"
}

git commt しても VS Code ではなく他のエディターが開くこともあります。そのような場合は以下を参考に、エディターとして code --wait を指定すると VS Code で開くようになります。

• Git-のカスタマイズ-Git-の設定
• Gitの内側-環境変数

なお、とりあえず試してみるだけならば GIT_EDITOR 環境変数を変更するのが簡単かと思います(後述の GitHub CLI にも反映されるようです)。

$ export GIT_EDITOR="code --wait"

デフォルトで利用できる Copilot の機能

普通にエディターなので Copilot が有効であればデフォルト状態でもコミットメッセージのサジェストなどをやってくれます。おそらくは編集中の COMMIT_EDITMSG の内容がコンテキストになっていると思われますが、ブランチ名や変更のあったファイル名一覧が含まれるているので、わりと良い感じにサジェストしてくれます。

図 2-1 Copilot によるサジェスト

また、Copilot のインラインチャットも利用できます。

図 2-2 インラインチャットの利用

この辺の編集支援だけでもやりやすくなるので「もうデフォルトのままでもいいんじゃないかな」という気にもなってきます。

インラインチャットは GitHub Copilot Chat 拡張機能をインストール後、以下の方法で開始できます。

• エディターで ctrl + i(vscode-vim とコンフリクトするかもしれません)
• コマンドパレットから Inline Chat: Start Inline Chat
• エディターで右クリックし「Copilot / Start Inline Chat」

コミットメッセージ生成機能に近づける

「もうデフォルトのままでもいいんじゃないかな」と言いましたが、やはり隣の芝生は青く見えてきます。

対応として git commit でエディターを開くときに最初から生成されたテキストが挿入される方法を探したのですが、見つかりませんでした。

その代わりでもないのですが、サジェストなどの精度を上げる方法として、git commit に -v を指定することでコミットメッセージの編集時に diff の内容を挿入してみます。

https://qiita.com/magicant/items/f66528f83fccd1b1fdbb
https://git-scm.com/docs/git-commit#Documentation/git-commit.txt--v

図 3-1 git commit -v による diff の挿入

前述のように COMMIT_EDITMSG の内容をコンテキストにしているようなので、diff の挿入によりサジェストやインラインチャットの応答が具体的になったと感じています。 (「なった」と言い切りたいところですが、やはりバラ付きはあります)

また、この状態になればインラインチャットで “make commit message” のように指示すると、生成機能ぽい感じになります。 (以下の例は上手くいっている方なので、あまり過度な期待はしないでください)

図 3-2 生成機能とインラインチャットの比較(diff なし)

• 生成機能: Add readline functionality to index.mjs
• インラインチャット: Add new feature

図 3-3 生成機能とインラインチャットの比較(diff あり)

• 生成機能: Add readline functionality to index.mjs
• インラインチャット: Add readline functionality to index.mjs

このような感じになるので、コミットメッセージ生成への影響を確認できたら、Git の設定で -v をデフォルトにもできます。

リスト 3-1 ~/.gitconfig または ~/.config/git/config へ以下を追加

[commit]
  verbose = true

あとは、まだ試行錯誤中ですが、コミットテンプレートなどから指示を埋め込んでおくとより精度が良くなるかなと考えています。

そして、ここまで書いておいてアレなのですが、それでも生成機能に頼りたくなることもあります。その場合は普通に生成してから「コピペしちゃうんだな、これを」という対応にしています。

コミットメッセージ編集時、動的にテキストを挿入する方法としては Git Hooks を利用する方法もあります。

こちらはシェルスクリプトを作成したりと少し手間ですが、diff 以外の情報なども挿入できるようになります。ただし、あまりやりすぎるのも良くはないようです^[1]。

ターミナル内で git commit した後

GitHub を利用している場合、git commit した後はプルリクエストを作成することになるかと思います。話はそれてしまいますが、プルリクエストの説明などもエディターで記述する利点を少しだけ。

プルリクエスト作成は GitHub Pull Requests and Issues を使う方法もありますが、ターミナル内で操作を継続するなら GitHub CLI(gh コマンド)もおすすめです。

たとえば、コマンドラインから gh pr create を実行すると、ボディ(プルリクエストの説明)を Markdown として記述するので、こちらもエディターから Copilot を利用できます。

図 4-1 gh pr create で編集時にインラインチャットを利用

図 4-2 作成されたプルリクエスト

ただし、こちらもエディターでの記述がベストと一概には言えないのが悩み所です。

• GitHub Pull Requests and Issues にも Copilot による生成機能がある
• コメント記述時に @ などの入力補完を利用できない

私は gh pr checks --watch なども使いたいので Git 関連の操作はターミナルに寄せていますが、それでも場合によってツールを使い分けているといった感じです^[2]。

GitHub CLI も設定によっては他のエディターが開くこともあります。変更方法は下記を参照してください。

• GitHub CLI クイックスタート - GitHub Docs

おわりに

コミットメッセージを VS Code のエディターで記述するとき、GitHub Copilot の生成機能をできるだけ利用してみました。

Copilot はなんとなくデフォルトのままで使っていましたが、コンテキストとなる情報を少し追加するだけでも生成物の精度が向上することを体験できました。

今後も生成 AI におまかせするだけでなく、工夫しながら利用できればと思っています。

脚注

1. Hook 用スクリプトを Dev Container 内に配置する Feature を作ったとき履歴も含たのですが、単純な前方一致で「似ているコミットメッセージをサジェストする」ことが増えました。

2. 最近、Copilot CLI が GitHub CLI の extension になったので gh copilot コマンドが使えるようになりました。ここに「gh copilot pr みたいな機能が追加されないかな」と妄想しています。