feature image

2023年12月8日 | ブログ記事

Emoji Prefix with your `core.editor` (2)

この記事はtraPアドベントカレンダー8日目の記事です。

いくら・はむ(@ikura-hamu)です。主にGoを書いています。

まずは

まずは、らすさん(@Ras)のこちらの記事をご覧ください。

https://trap.jp/post/1995/

Emoji Prefix with your `core.editor`
この記事は、夏のブログリレー25日目の記事です。 こんにちは。20Bの@Rasです。 Gitでコミットを生成するときに先頭に絵文字 (以下Emoji) を付ける「Emoji Prefix」を採用しています。 先頭につけるEmojiのルールは好みやチームの方針によって異なりますが、新規機能の実装には「✨」、バグの修正には「🐛」などを付けることが多いです。 Emoji Prefixを用いることの利点は以下のようなものです。 * 見た目が楽しい * コミットをカテゴリーに分類することができる * 見た目が楽しい * 視認性の向上 * 見た目が楽しい 今回は、Emoji Pre…

読みましたか?

この記事は勝手に書いた続編です。僕はこれを読んでVimでの設定をやったのですが、VSCodeでのコミットが個人的に好みだったので、VSCodeでも快適にEmoji Prefixのコミットメッセージを書く設定をしました。

Emoji Prefixが何たるかとかモチベーションとかは前の記事を参考にしてください。

Emoji Prefix with your VSCode

コミット用エディタをVSCodeにする

シェルで下のコマンドを実行します。Gitのコミット用エディタをVSCodeにして、タブが閉じるまで待つという意味です。VSCodeにパスが通っている必要があります。

git config --global core.editor "code --wait"

VSCodeの設定から、git.useEditorAsCommitInputにチェックを入れます。(デフォルトで入ってるっぽいです。)

ユーザースニペットを設定する

ユーザースニペットを設定することで、短い単語を入力するだけで絵文字を出せるようにします。

左下の歯車マークから「ユーザースニペット」をクリックします。上に言語を選ぶ欄が出てくるので、git-commit.jsonを選びます。

git-commit.jsonというJSONファイルが開くので、編集します。

git-commit.json{
    "タイトル": {
        "prefix": "{{省略形}}",
        "body": "{{スタンプ}} ",
        "description": "{{説明}}"
    },
    "...": {
        ...
    }
}

{{省略形}}に書かれた部分を入力すると、補完候補から{{スタンプ}}が選べます。僕はよく使うものをこんな感じで設定しています。使う絵文字はhttps://gitmoji.dev/ を参考にするといいんじゃないでしょうか。

git-commit.json{
	// Place your snippets for git-commit here. Each snippet is defined under a snippet name and has a prefix, body and 
	// description. The prefix is what is used to trigger the snippet and the body will be expanded and inserted. Possible variables are:
	// $1, $2 for tab stops, $0 for the final cursor position, and ${1:label}, ${2:another} for placeholders. Placeholders with the 
	// same ids are connected.
	// Example:
	// "Print to console": {
	// 	"prefix": "log",
	// 	"body": [
	// 		"console.log('$1');",
	// 		"$2"
	// 	],
	// 	"description": "Log output to console"
	// }

	"Feature": {
		"prefix": "fe",
		"body": ":sparkles: ",
		"description": "Introduce new feature"
	},
	"Bugfix": {
		"prefix": "bu",
		"body": ":bug: ",
		"description": "Fix a bug"
	},
	"Refactor": {
		"prefix": "re",
		"body": ":recycle: ",
		"description": "Refactor code"
	},
	"Documentation": {
		"prefix": "do",
		"body": ":memo: ",
		"description": "Add or update documentation"
	},
	"Test": {
		"prefix": "te",
		"body": ":white_check_mark: ",
		"description": "Add or update tests"
	},
	"WIP": {
		"prefix": "wip",
		"body": ":construction: ",
		"description": "Work in progress"
	},
	"Bandage": {
		"prefix": "ad",
		"body": ":adhensive_bandage: ",
		"description": "Simple fix for a non-critical issue"
	},
	"Breaking Change": {
		"prefix": "bo",
		"body": ":boom: ",
		"description": "Introduce breaking changes"
	},
	"Remove": {
		"prefix": "rm",
		"body": ":fire: ",
		"description": "Remove code or files"
	},
	"Configuration": {
		"prefix": "co",
		"body": ":wrench: ",
		"description": "Change configuration files"
	},
	"Update": {
		"prefix": "up",
		"body": ":arrow_up: ",
		"description": "Update dependencies"
	},
	"Format": {
		"prefix": "fo",
		"body": ":art: ",
		"description": "Improve structure / format of the code"
	},
	"Performance": {
		"prefix": "zap",
		"body": ":zap: ",
		"description": "Improve performance"
	},
    "Performance2": {
		"prefix": "isu",
		"body": ":chair: ",
		"description": "Improve performance"
	}
}

このように設定すると、例えば fe まで入力すると補完の1番上にfeが出てきて、それを選択すると :sparkles: (✨)が入力できます。

(お好みで)コミットテンプレートを用意する

https://trap.jp/post/1995/#おまけ を参考にコミットメッセージのテンプレートを用意しておくと絵文字のカンペができてうれしいです。#がついた行はコメントとして認識され、コミットメッセージには含まれません。

git config --global commit.template {{テンプレートのパス}}

(お好みで)Verbose Commitを有効にする

VSCodeの設定からgit.verboseCommitにチェックを入れます。ここにチェックを入れると、コミットメッセージのエディタが開いたときに変更箇所がエディタに表示されます。

これの嬉しいところは、GitHub Copilotがdiffを読んでいい感じのコミットメッセージを生成してくれるところです。しかし、上のコミットテンプレートを使うとなぜか読んでくれなくなってしまいました。自分でメッセージを書くのにも便利なので設定はオンにしています、

こんな感じになる

設定を全部入れるとこんな感じになります。VSCodeのコマンドパレットを使えば最速でコミットできると思います。

やってることは

  1. Ctrl+Shift+Pでコマンドパレットを開く
  2. Commit Allを選ぶ
  3. feと打つ
  4. feに対応する設定したスニペットFeatureが補完に出てくるので、Enterを押す
  5. :feature: と入力される
  6. 普通にコミットメッセージを書く
  7. Ctrl+Sで保存
  8. Ctrl+Wでタブを閉じる

です。サクッとコミットできてうれしいです。

おわり

絵文字付きのにぎやかなコミットメッセージをらくらく書けるようになって、コミットするたびに楽しいです。みなさんはどのようにコミットメッセージを書いていますか? "Emoji Prefix with your core.editor (3)"、待ってます。

明日は @mehm8128さん の記事と、 @karoさんさんの記事です。

ikura-hamu icon
この記事を書いた人
ikura-hamu

SysAd班、ゲーム班 いろいろやりたい

この記事をシェア

このエントリーをはてなブックマークに追加
共有

関連する記事

2023年12月11日
DIGI-CON HACKATHON 2023『Mikage』
toshi00 icon toshi00
2023年12月13日
HgameOPについて語る
noc7t icon noc7t
2023年12月25日
オレオレRustプロジェクトテンプレート
H1rono_K icon H1rono_K
2023年12月18日
GPU側でレイヤーブレンドする絵描きソフトの同期方法
tq icon tq
2023年12月16日
MacからWindowsを弄る方法?~RDP環境を作ろう~
Alt--er icon Alt--er
2023年12月4日
私的ジャンル別最強映画番付(2023年版)
botoku_izm icon botoku_izm
記事一覧 タグ一覧 Google アナリティクスについて