100 人が閲覧(直近 30 日) GitHub

Git Graphの使い方|VS Codeでコミット履歴・ブランチを可視化する拡張機能と見方

Git Graphの使い方|VS Codeでコミット履歴・ブランチを可視化する拡張機能と見方

Git Graphは、VS Codeの中でコミット履歴をブランチの線つきで表示し、右クリックからマージやチェックアウトまで実行できる拡張機能です。この記事では、インストールと開き方、グラフの見方、ブランチ操作、表示されないときの原因を順に説明します。

先に知っておきたいのは、Git GraphのMarketplaceでの安定版更新が2021年4月の1.30.0で止まっている点です。VS Code本体にも2024年からグラフ表示が入ったので、どちらを使うかの判断基準も後半で比較します。設定名や既定値は、拡張機能のソースコード(v1.30.0)から確認した値です。

まとめ:Git Graphで押さえる要点

  • Git Graphは無料の拡張機能で、Marketplaceでのインストール数は約1,550万。開き方はステータスバーの「Git Graph」か、コマンドパレットの「Git Graph: View Git Graph (git log)」。
  • グラフの丸がコミット、縦の線がブランチの系譜、線が合流する行がマージコミットです。既定は日付順の並びなので、ブランチをまたいでコミットが交互に並びます。
  • ブランチ操作は、ブランチ名のラベルかコミットの行を右クリックして実行します。マージの既定は「早送りできても新しいコミットを作る」(--no-ff相当)で、コマンドの既定と違います。
  • 表示されない原因の一つは、Gitリポジトリをサブフォルダとして含む親フォルダを開いているケースです。既定ではサブフォルダを探さないので、git-graph.maxDepthOfRepoSearchを1以上にします。
  • 画面は英語のみで、日本語化の手段はありません。Marketplaceの最終安定版は2021年4月5日の1.30.0で、その後GitHubには1.31.0のベータ版が公開されています。
  • 新しく入れるなら、まずVS Code標準の「Source Control Graph」を試し、マージ・リベース・リセットをグラフから実行したいときにGit Graphを足す、という順で選ぶと迷いません。

Git Graphとは:VS Code上でgit logをグラフ表示する拡張機能

Git Graphは、開発者mhutchieが公開しているVS Code拡張(拡張ID mhutchie.git-graph)です。Visual Studio MarketplaceのAPIで2026年10月15日に確認した値は、インストール数15,506,039、評価4.94(679件)でした。

できることは大きく3つあります。ローカルとリモートのブランチ・タグ・未コミットの変更を1枚のグラフに表示すること、コミットをクリックして変更ファイルと差分を見ること、右クリックからブランチ・タグ・スタッシュの操作を実行することです。コマンドを覚えていなくても、履歴の形を見ながらGitを操作できます。

利用は無料です。ただしライセンスはMITとは違う独自のもので、使用・複製・改変は許可する一方、「Permission is NOT GRANTED to publish, distribute, sublicense, and/or sell derivative works of the Software.」と、改変版の公開・配布・販売を認めていません。社内で改造版を配る予定があるなら、この条項に引っかかります。

2021年4月から安定版の更新が止まっている点の扱い

Marketplaceの最新版は1.30.0(2021年4月5日)です。GitHubのリポジトリはアーカイブされていませんが、最後のコミットは2021年9月19日(1.31.0-beta.3)で、未解決のIssueはプルリクエストを除いて313件あります(2026年10月15日、GitHub APIで確認)。拡張機能が要求するVS Codeのバージョンは^1.38.0なので、現行のVS Codeにもインストールできます。

更新が無いことは、すぐ動かなくなることを意味しません。気にすべきなのは、今後のVS Codeの変更で生じる不具合への修正を期待しにくいことと、必要なGit操作を拡張機能が提供しているかを個別に確認する必要があることの2点です。業務PCで拡張機能の保守状況を審査している組織では、導入が通らないことがあります。その場合は後述のVS Code標準のグラフかGitLensを選んでください。

Git Graphのインストールと開き方

  1. VS Codeの拡張機能ビューを開く(Windows・LinuxはCtrl+Shift+X、macOSはCmd+Shift+X)。
  2. 検索欄に「git graph」と入力し、発行元が「mhutchie」の「Git Graph」を選んで「インストール」を押す。名前の似た別の拡張が並ぶので、発行元で見分けます。
  3. Gitで管理しているフォルダ(.gitがあるフォルダ)をVS Codeで開く。

画面の開き方は3通りあります。

  • ステータスバー(画面下端)の「Git Graph」をクリックする。表示されていなければ設定git-graph.showStatusBarItemがfalseになっていないか確認します。
  • コマンドパレット(Ctrl+Shift+P/Cmd+Shift+P)で「Git Graph: View Git Graph (git log)」を実行する。
  • ソース管理ビューの上部に並ぶアイコンから「View Git Graph」を押す。

Cursorなど、Open VSXから拡張を取得するエディタでも同じ1.30.0がOpen VSXに公開されています(ダウンロード数1,163,356)。

Git Graphのグラフの見方:線・丸・ラベルの読み方

グラフの読み方は、ターミナルでgit log --graphを実行したときの図と同じです。次の履歴を作って確かめました(git 2.50.1)。mainからfeature/loginを分岐し、両方にコミットしてからmainへマージし、最後にhotfixブランチを切っています。

$ git log --graph --oneline --all --decorate
* 01d8d85 (hotfix) 誤字を修正
*   11f6074 (HEAD -> main, tag: v1.0) Merge branch 'feature/login'
|\
| * 443b956 (feature/login) 入力チェックを追加
| * 07e4201 ログイン画面を追加
* | d9a0613 READMEを更新
|/
* 90490df 初期コミット

Git Graphでは、この*が丸、|と/が色つきの線になります。

画面の要素 意味 関係する設定(既定値)
丸 1つのコミット –
縦の色つきの線 ブランチの系譜(色はレーンごと) git-graph.graph.colours
2本の線が合流する行 マージコミット git-graph.repository.commits.mute.mergeCommits(true=薄い文字)
線の角 分岐と合流の描き方 git-graph.graph.style(rounded)
ブランチ名のラベル 同名のローカル・リモートブランチが同じコミットなら結合 ラベル結合の設定(true)
タグのラベル タグが指すコミット git-graph.repository.showTags(true)
先頭の白抜きの丸 未コミットの変更 git-graph.graph.uncommittedChanges

ラベル結合の設定はgit-graph.referenceLabels.combineLocalAndRemoteBranchLabelsです。上の例では、11f6074の行で2本の線が合流しているのでマージコミットだと分かります。(HEAD -> main, tag: v1.0)は「今チェックアウトしているのがmainで、v1.0タグもここを指している」という意味です。

コミットの並び順:日付順とトポロジカル順の違い

Git Graphの並び順の既定はdate(コミット日時順)です。同じ履歴を日付順で出すと、feature/loginのコミットとmainのコミットが日時に従って交互に並びます。

$ git log --graph --oneline --all --date-order
* 01d8d85 誤字を修正
*   11f6074 Merge branch 'feature/login'
|\
| * 443b956 入力チェックを追加
* | d9a0613 READMEを更新
| * 07e4201 ログイン画面を追加
|/
* 90490df 初期コミット

ブランチごとにまとまって見たいときは、設定git-graph.repository.commits.orderをtopoにします。git logの公式ドキュメントは--topo-orderを「複数の履歴の線が混ざって表示されるのを避ける」並びと定義しています。並び順は、グラフの列見出しを右クリックしてリポジトリごとに切り替えることもできます。

コミット詳細の表示と2コミット間の差分比較

コミットの行をクリックすると、その行の下に詳細ビューが開き、作者・日時・メッセージと変更ファイルの一覧が出ます。ファイル名をクリックするとVS Codeの差分エディタで変更前後を比べられます。

2つのコミット間の差分は、1つ目のコミットをクリックしたあと、2つ目をCtrl(macOSはCmd)を押しながらクリックします。リリース前に「前回のタグから何が変わったか」を見るときに使います。詳細ビューを開いた状態では、上下キーで隣のコミットへ移れます。

グラフ画面のキー操作は次のとおりです。

  • Ctrl/Cmd + F:コミットを検索
  • Ctrl/Cmd + H:HEADのコミットまでスクロール
  • Ctrl/Cmd + R:グラフを再読み込み
  • Ctrl/Cmd + S:スタッシュまでスクロール

Git Graphでブランチを操作する:作成・切り替え・マージ・削除

操作は、ブランチ名のラベルかコミットの行を右クリックして選びます。マージするときは、先に取り込み先のブランチをチェックアウトしてから、取り込み元を右クリックして「Merge into current branch…」を選びます。ブランチ名のラベルをダブルクリックすると、そのブランチをチェックアウトできます。ダイアログのチェックボックスには既定値があり、コマンドの既定と違うものがあるので注意が必要です。

操作 右クリックする場所 ダイアログの既定 コマンドで書くと
ブランチ作成 起点のコミット 作成後にチェックアウトしない git branch 名前 コミット
切り替え ブランチ名(ダブルクリック可) – git checkout 名前
マージ 取り込むブランチ名 早送りできても新しいコミットを作る git merge --no-ff 名前
リベース 土台にするブランチ名 作者日時を現在日時に変更する git rebase --ignore-date 名前
削除 ブランチ名 強制削除しない git branch -d 名前
リセット 戻したいコミット Mixed git reset --mixed コミット
スタッシュ 未コミットの変更 未追跡ファイルも含める git stash push -u

差が出やすいのはマージとスタッシュです。マージの既定(git-graph.dialog.merge.noFastForwardがtrue)は、コマンドのgit mergeなら早送りで済む場面でもマージコミットを作ります。スタッシュの既定(git-graph.dialog.stashUncommittedChanges.includeUntrackedがtrue)は、コマンドのgit stashでは対象外の未追跡ファイルまで退避します。チームで「早送りマージで履歴を一直線にする」と決めているなら、マージのダイアログでチェックを外すか、この設定をfalseにしてください。

コミットの行の右クリックからは、チェリーピック・リバート・コミットのドロップも実行できます。各コマンドの意味はGitコマンド一覧|用途別早見表とよく使う基本コマンドの使い方を解説で確認できます。

リモートと同期する:Fetch・Pull・Push

グラフ上部の「Fetch」ボタンで全リモートから取得し、リモートブランチの位置をグラフに反映します。Pullはリモートブランチ名を右クリックして選び、Pushはローカルブランチ名の右クリックから実行します。リモートで消されたブランチをFetchのたびに掃除したいときは、git-graph.repository.fetchAndPruneをtrueにします(既定はfalse)。

リセット・ドロップ後のコミット復元とreflog

リセットやコミットのドロップで消えたように見えるコミットも、多くはreflogに残っています。設定git-graph.repository.includeCommitsMentionedByReflogsをtrueにし、Branchesを「Show All」にすると、reflogだけが参照しているコミットもグラフに出るので、目的のコミットを右クリックしてブランチを作れば復元できます。マージを取り消す手順はgit mergeの取り消し|abort・reset・revert -mの使い分け、消したスタッシュの探し方はgit stashの削除:drop・clearの使い分けと消したstashの復元手順で説明しています。

Git Graphが内部で実行しているgit logコマンド

Git Graphのグラフは、裏でgit logを実行した結果から描かれています。v1.30.0のソース(src/dataSource.tsのgetLog)を読むと、「すべてのブランチを表示」の状態では次の引数を組み立てています。

git -c log.showSignature=false log --max-count=301 --format=(独自の書式) --date-order \
  --branches --tags --remotes (スタッシュの基点コミット) HEAD

初回に表示するのは300件(git-graph.repository.commits.initialLoadの既定)で、続きがあるかを判定するために1件多い301件を取得しています。スクロールすると100件ずつ追加で読み込みます。スタッシュの基点コミットの個別指定と取得件数の制限を省いた、ターミナル向けの簡略例は次のとおりです。

git log --graph --oneline --decorate --date-order --branches --tags --remotes HEAD

普段使いならgit log --graph --oneline --decorate --allで十分です。--allはrefs/以下のすべての参照とHEADを指定したものとして扱うので、スタッシュも含めて表示します。--graphは既定で--topo-orderの並びになるため、Git Graphと同じ日付順で見たいときだけ--date-orderを足します。

マージ先の流れだけを追いたいときは--first-parentを付けます。先ほどの例でmainに付けると、ブランチ側のコミットが消えて3行になります。

$ git log --graph --oneline --first-parent main
* 11f6074 Merge branch 'feature/login'
* d9a0613 READMEを更新
* 90490df 初期コミット

Git Graphでもgit-graph.repository.onlyFollowFirstParentをtrueにし、Branchesでmainだけを選ぶと、上の例と同じ3コミットに絞れます。ターミナルで操作を完結させたいなら、キー操作でグラフを扱えるLazygit入門|Windows・Mac・Linuxのインストールと使い方・ショートカットを徹底解説も選択肢です。

Git Graphが表示されない・ブランチが出ないときの原因

エラーメッセージの文言はソースコードに書かれているので、表示された英文から原因を絞れます。

症状・メッセージ 原因 対処
No Git repositories were found in the current workspace リポジトリを含む上位フォルダを開いているなど 探索の深さを1以上に
同上(サブモジュールなど) 入れ子のリポジトリは自動検出しない 「Git Graph: Add Git Repository…」
Unable to find a Git executable Git未導入かパス不明 Gitを入れるか git.path を設定
特定のブランチだけ出ない Branches欄で絞り込んでいる Branchesを「Show All」に
リモートブランチが出ない 未Fetchか表示オフ Fetchし Show Remote Branches をオン
新しいコミットが出ない 画面が古いまま Ctrl/Cmd + R で再読み込み
ステータスバーにボタンがない 表示設定がオフ showStatusBarItem を true に

1行目は探索範囲の設定で切り分けられます。設定git-graph.maxDepthOfRepoSearchの既定は0で、ワークスペースとして開いたフォルダそのものだけを調べ、サブフォルダは探しません。複数のリポジトリを1つの親フォルダにまとめて開いている場合は、この値を1か2にしてVS Codeを再読み込みします。

開いたときに現在のブランチだけが出る場合は、git-graph.repository.onLoad.showCheckedOutBranchがtrueになっていないかも確認してください。既定はfalse(全ブランチを表示)です。

Git Graphは日本語化できない:画面は英語のみ

Git Graphには翻訳の仕組みがありません。v1.30.0のリポジトリには翻訳用のファイル(package.nls.*.jsonなど)が1つも無く、メニュー・ダイアログ・設定の説明は英語の文字列が直接書かれています。VS Codeに日本語の言語パックを入れても、Git Graphの画面は英語のままです。

日本語の画面で履歴を見たい場合は、VS Code本体のSource Control Graphを使います。本体の機能なので、VS Codeの表示言語に従います。

日本語に関係する設定で効くのはgit-graph.fileEncodingです。既定はutf8で、Shift_JISで保存した古いファイルの差分が文字化けするときはshift_jisを指定します(使える文字コードはiconv-liteの一覧に従います)。

VS Code標準のグラフ・GitLensとの比較と選び方

VS Code本体は、1.92(2024年7月版)でソース管理ビューに履歴のグラフを標準で表示するようになり、1.93で独立した「Source Control Graph」ビューへ移しました。VS Code 1.141.0に同梱されている設定と右クリックメニューを確認し、Git Graph・GitLensと並べたのが次の表です。

項目 Git Graph VS Code標準 GitLens
導入 拡張機能 不要(1.92以降) 拡張機能
料金 無料 無料 非公開リポジトリはPro
最終更新 2021-04-05 週次のVS Code安定版リリース 2026-10-01(安定版19.3.0)
マージ・リベース 右クリックで可 グラフからは不可 可
リセット・リバート 右クリックで可 グラフからは不可 可
チェリーピック 可 可 可
2コミットの比較 可 可(Compare with…) 可
日本語表示 不可 表示言語に従う 日本語の翻訳なし

VS Code標準のグラフは、ソース管理ビュー(Ctrl+Shift+G)の下部に出ます。右クリックでできるのは、チェックアウト・ブランチやタグの作成と削除・チェリーピック・比較・コミットハッシュのコピーまでです。マージとリベースはソース管理ビューの「…」メニューから、リセットはターミナルのコマンドで行います。表示件数はscm.graph.pageSize(既定50、最大1000)で変えられます。

GitLensのCommit Graphは、公開リポジトリとローカルリポジトリなら無料で使え、非公開リポジトリでは「Only private repository access requires a GitLens Pro subscription or trial.」とPro契約かトライアルが必要です。Marketplaceのインストール数は約5,333万で、更新も続いています。

選び方は次のとおりです。

  • 履歴を眺めてブランチを切り替えるだけなら、VS Code標準で足ります。拡張機能を増やさずに済み、VS Code本体の更新に合わせて保守されます。
  • マージ・リベース・リセット・スタッシュまでグラフから操作したく、保守停止を許容できるならGit Graphです。git logの取得結果をグラフとして表示し、コミットの右クリックからGit操作を実行できます。
  • 非公開リポジトリでプルリクエストのレビューや変更履歴の追跡までVS Code内で行うなら、GitLensのPro契約を検討します。
  • Git Graphを避けたほうがよいのは、拡張機能の保守状況が審査対象になっている組織と、改造版を社内配布したいケースです(ライセンスで禁止)。

同じ名前を含む後発の拡張として、Git Graph Plus(拡張ID the0807.git-graph-plus、2026年3月公開、0.7.3、Apache-2.0)があります。インストール数は2026年10月15日時点で3,388で、元のGit Graphとは発行元が別の拡張機能です。GUIのGitクライアントを別アプリで使う選択肢はSourcetreeの使い方|インストールから認証・カスタムアクションまでで扱っています。チームのブランチ運用やCI/CDの整備まで見直す場合は、DevOps・CI/CD導入支援でもご相談を受けています。

Git Graphのよくある質問

Git Graphの開き方は?

Gitで管理しているフォルダをVS Codeで開き、ステータスバーの「Git Graph」をクリックします。コマンドパレットで「Git Graph: View Git Graph (git log)」を実行しても開けます。

Git HistoryとGit Graphはどっちを使えばよいですか?

特定のファイルや行がいつ誰に変えられたかを追うならGit History(donjayamanne.githistory)です。「Git: View File History」「Git: View Line History」のコマンドがあります。ブランチの分岐とマージを図で見て、そのまま操作したいならGit Graphです。Git Historyも最終更新は2023年3月5日の0.6.20で止まっているため、新しく入れるならVS Code標準のグラフも候補に入れてください。

GitHubのブランチツリーをグラフで表示するには?

GitHubのWeb画面では、リポジトリの「Insights」から左メニューの「Network」を開くとネットワークグラフが出ます。GitHubの公式ドキュメントによると、表示されるのはフォークを含めて直近にプッシュされた最大100本のブランチです。手元のクローンをGit Graphで開けば、GitHubの100本制限とは別に、ローカルブランチとFetch済みのリモート追跡ブランチを確認できます。

Git Graphはコマンドだけで代用できますか?

できます。git log --graph --oneline --decorate --allで、Git Graphとほぼ同じ形の図がターミナルに出ます。Git Graphと同じ並び順にするなら--date-orderを足します。

Git Graphは無料で使えますか?

無料です。料金プランや有料版はありません。ただしライセンスで改変版の公開・配布・販売は禁止されています。

関連記事

お気に入りに入れた記事の一覧

一創の公式 SNS

X では毎朝の新着記事と IT ニュースの速報を、YouTube・TikTok・Instagram・LinkedIn・Facebook では記事の解説動画を配信しています。

この記事は以下の記事からリンクされています

資料請求

今日のトレンド記事 直近 24 時間で、いつもより多く読まれている記事

  1. 2026.11.09 テックブログ エディオン不正アクセス第2報:カード番号の対象確認とログ・決済画面の改ざん対策
  2. 2026.11.09 テックブログ LANSCOPE不正アクセス第2報:製品への影響と偽連絡の確認、停止中のライセンス認証の窓口
  3. 2026.11.10 テックブログ Claude Fable 5.2とは:料金・破壊的変更4点とFable 5.1からの移行手順【2026年11月】
  4. 2026.11.09 テックブログ ステップゴルフ不正アクセス:口座情報の対象確認と偽連絡・引き落としの注意点
  5. 2026.11.10 テックブログ ニトリの情報漏洩:最大3,762万件の対象確認となりすまし連絡の見分け方

RELATED POSTS 関連記事

目次