“git diff”コマンドの実行結果をGithub風に表示できる”git-split-diffs”

2021-05-242023-03-27Bash,Git,GitHub

はじめに

git diff コマンドの実行結果を Github の diff 表示のようなスタイルに変更できる 「git-split-diffs」 というツールを見つけたので紹介します。

検証環境

$ uname -moi
x86_64 MacBookPro16,1 Darwin

$ bash -version | head -n 1
GNU bash, version 5.1.8(1)-release (x86_64-apple-darwin20.3.0)

$ node --version
v15.12.0

$ yarn --version
1.22.10

git-split-diffs とはなに？

ターミナル上で git diff したときに、実行結果を Github 風に表示してくれるツールです。

はじめはターミナル上で実行するのに Github 風にとは一体？と思いましたが、実際に使ってみたいと思います。

前提環境

node 1.12 以上がインストールされている必要があります。

インストール

npm コマンドまたは yarn コマンドが使えれば、以下のコマンドでインストール可能です。
どちらかお好きな方をどうぞ。

# NPMを使う場合
$ npm install -g git-split-diffs

# YARNを使う場合
$ yarn global add git-split-diffs

実行したあとは git config コマンドを使って、 diff の実行結果の表示に git-split-diffs が使われるようにしてやります。

$ git config --global core.pager "git-split-diffs --color | less -RFX"

もし設定を解除したい場合は ~/.gitconfig から以下の行を削除してください。i

[core]
  ...
  pager = git-split-diffs --color | less -RFX  ## << この行を削除

使ってみる

早速使ってみたいと思います。
動作確認のために、 git-split-diffs 自身の Git リポジトリを拝借したいと思います。

$ git clone git@github.com:banga/git-split-diffs.git

$ cd git-split-diffs

ログを確認してみます。

$ git log

ログがカラーリングされて見やすいですね。

コードの修正履歴も見てみます。

$ git log -p

おお！Github ページっぽい。

ターミナルが一定サイズよりも狭い場合には side by side ではない表示に切り替わります。

ターミナル表示が狭い場合にも side by side 表示をしたい場合には、表示幅を狭く調整していやります。

$ git config --global split-diffs.min-line-width 40

git diff も見てみましょう。

見やすいですね。馴染みのあるスタイルに安心感があります。

更にWebっぽいテーマに変更することもできます。

git config --global split-diffs.theme-name light

Webページに見える。。。。

いずれの設定（ git config ) も、 --global オプションを除外すれば該当Git作業ディレクトリだけに反映されます。

ひとこと

一点だけ、問題があります。

全角文字を使うと表示が崩れてしまうということです。多くのツールで毎度付き合わないといけない問題がやはりこのツールにも。

全角文字が含まれていても安定して動作するツールとして考えると、 delta のほうが良さそうに思えます。

とはいえ、しばらくは git-split-diffs を使って見たいと思います！
無意味に git diff しまくりたい！