アルアカ - Arcadia Academia

Arcadia Academiaは「エンジニアリングを楽しむ」を合言葉に日本のデジタル競争力を高めることをミッションとするテックコミュニティです。

VSCode差分比較・Diff完全ガイド|拡張機能なしでファイル・ブランチ比較【2026年版】

Featured image of the post

「vscode diff」と検索してみると、実は VSCode には標準機能だけでかなり強力な差分比較(vscode 差分比較)ができます。さらに拡張機能を導入すると、コードレビューから設定ファイルの確認まで幅広い用途に対応できます。

本記事では、標準の差分比較機能(3種類)から、おすすめ拡張機能実践的な活用シーンまでを丁寧に解説します。

比較したい内容 使う機能
2ファイルの差分 コマンドパレット → Compare Active File With...
Gitの変更差分 ソース管理ビュー(Ctrl+Shift+G)
テキストの一部だけ比較 Partial Diff 拡張機能
ブランチ間の差分 git difftool コマンド / GitLens

[目次を開く]

1. VSCodeで2つのファイルの差分を比較する方法

VSCodeでは、2つのファイルの違いを直接比較することができます。手順は以下の通りです。

コマンドパレットを使う

  1. Ctrl + Shift + Pコマンドパレットを開く。
  2. Compare と入力し、Files: Compare Active File With... を選択。
  3. 比較したいファイルを選択する。
  4. 差分が表示される。

コマンドパレットを使うことで、開いているファイル同士を簡単に比較できます。

VSCodeの「Compare(比較)」機能について補足

Files: Compare Active File With... の他にも以下の種類があります。

Compareの種類 機能詳細
Compare Active File With… 現在開いているファイルを別のファイルと比較
Compare Active File with Saved 現在開いている最後に保存した状態と比較
Compare Active File with Clipboard 現在開いているファイルとクリップボードを比較

2. Gitを使用した差分の比較

VSCodeはGitと強く統合されており、リポジトリ内の変更を素早く確認できます。

方法① ソース管理ビューを使う

Image in a image block
  1. Ctrl + Shift + G G もしくは、上記の画像の赤丸のアイコンをクリックし ソース管理ビューを開く。
  2. 変更のあるファイルがリストアップされるので、クリックする。
  3. 変更前と変更後のファイルが並んで表示され、差分がハイライトされる。

この方法は、Gitリポジトリを使用している場合に便利です。

方法② コマンドラインを使う

ターミナル(Ctrl + @ )を開いて、以下のコマンドを実行すると、VSCodeの差分ビューを開くことができます。

git difftool --tool=code --dir-diff

また、特定のブランチ間の差分をVSCodeで確認する場合は、以下のコマンドを実行します。

git difftool main feature-branch

3. 拡張機能を使ってより高度な比較を行う

VSCodeには、より高度な差分比較を行うための拡張機能が用意されています。以下の拡張機能を導入すると、さらに便利に使えます。

① "Partial Diff"

  • 2つのテキスト選択範囲の差分を比較可能
  • 同じファイル内の異なる部分を比較できる
  • Partial Diff コマンドを実行することで使用可能

② "GitLens — Git supercharged"

  • Gitの変更履歴を詳細に可視化
  • 過去のコミット間の差分を簡単に比較
  • ファイル単位で変更のハイライト表示が可能

これらの拡張機能をインストールすると、差分の比較がより直感的になります。


4. VSCodeの差分比較を活用する場面

① コードレビュー

チーム開発では、Pull Request(PR)をレビューする際に変更点をチェックする必要があります。VSCodeを使えば、リモートリポジトリとローカルのファイルの差分をすぐに比較できます。

② 設定ファイルの変更比較

設定ファイル(config.json.env など)が意図せず変更されていないかをチェックする際にも、VSCodeの差分機能が役立ちます。

③ 過去バージョンとの比較

以前のバージョンと現在のファイルの違いを確認することで、バグの発見やリファクタリングの際の変更点を素早く把握できます。


5. よくある質問(FAQ)

Q. vscode diff はショートカットキーで開けますか?

A. はい。Ctrl+Shift+P でコマンドパレットを開き、compare と入力するとすぐに差分比較を開始できます。

Q. vscode 差分比較でブランチ間の差分を見る方法は?

A. ターミナルで git difftool main feature-branch を実行するか、GitLens 拡張機能の「Branch Compare」機能を使います。

Q. 拡張機能なしで2ファイルを比較する方法は?

A. Files: Compare Active File With... コマンドで拡張機能不要で比較できます。エクスプローラーでファイルを右クリック→「Select for Compare」も使えます。


まとめ

VSCode の差分比較(vscode diff)機能は、標準機能だけでも日常の開発で十分使えます。まずはコマンドパレットの Files: Compare Active File With... を覚えるだけで OK です。

さらに拡張機能を併用することで、チーム開発や大規模リポジトリでのvscode 差分比較が格段に快適になります。まずは Partial Diff 、次に GitLens の導入を検討してみてください。

💡 ショートカット: Ctrl+Shift+Pcompare と入力するだけですぐ差分比較を開始できます。

プログラミング学習でお悩みですか?

現役エンジニアがあなたの学習をマンツーマンでサポートします。

  • 学習の進め方がわからない
  • ポートフォリオの作り方を知りたい
  • 現場で使える技術を学びたい
まずは30分の無料相談

相談は完全無料・オンラインで気軽に

あなたを爆速で成長させるメンタリングプログラムはこちら

メンタープログラムバナー

プログラミングを学ぶならテックアカデミー

テックアカデミー
無料相談はこちら