😎

WinMergeがなくても大丈夫：Windows / macOS / Linux で VS Code を WinMerge 代わりに使う方法

に公開
Linux
VS Code
macOS
Windows
diff
tech

結論（先にざっくり）

  • 2つのテキストファイルを左右に並べて比較・編集したいだけなら、
    VS Code の標準機能だけで、WinMerge にかなり近いことができる。

  • しかも Windows / macOS / Linux で同じやり方 で再現できる。

  • ポイントは次の2つの設定だけ。

    Diff Editor: Render Side By Side → ON（チェックを入れる）
    Diff Editor: Render Side By Side Inline Breakpoint → 0

  • 2つのファイルの diff を開くときは、例えば次のようにする。

    code --diff path/to/file1.txt path/to/file2.txt

あとは、WinMerge でやっていた「2ファイル比較＋左右どちらも編集＋外部変更の自動反映＋スクロール位置維持というワークフローを、VS Code の diff 画面でそのまま再現して使える。

この記事では、その経緯と具体的な手順をまとめる。

後から気がついたのですが、
https://kuluna.github.io/blog/post/20190323/
上記サイトを掲載してる人がいました。
当記事は、内容的には、これと同じですが、より詳細に書いてます。

背景：WinMerge の何がそんなに便利だったか

私は Windows PC で開発作業をするとき、WinMerge をかなり多用している。

Git とは無関係に、ローカルのファイルを比較する場面が多いからだ。

  • バックアップしておいたコピーと、現在編集中のファイルを比べる
  • デバッグ中に「さっきの状態」と「今の状態」を比べたい
  • 途中経過のファイルは全部 Git にコミットしていない（手間なので）

こういう 「Git に乗せてないファイル同士を、比較しながら、編集／保存の調整をしたい」 場面で、WinMerge の次の性質がとても役立つ。

  1. 2つのファイルを左右に並べて差分表示できる
  2. WinMerge 上で左右どちらのペインも編集して保存できる
  3. 別のエディタでファイルを編集して戻ってくると、
    「ファイルが変更されました。再読み込みしますか？」と聞いてくれる
    → 「はい」を押すと、差分表示が更新されるのに、縦スクロール位置は維持 される

この 「スクロール位置を保ったまま差分が更新される」 挙動が、地味にめちゃくちゃ便利で、 一度慣れると手放せない。

Gitに載せてるものだけの比較だと、今のブランチのHEADリビジョンと編集中のものとの比較
過去のある時点のコミットした時点のものと、他のコミット時点や、今のソースコードとの比較
など比較対象の両方または、片方が少なくとも、Gitに載せた内容の場合は普通に
VS Code上で左右のペインで比較できることを知ってる人は多いし、
その場合の左右の比較の使い勝手は、Winmergeでの左右比較の使い勝手に匹敵する。
しかし、２つの比較ファイルがいずれもGitに乗ってない場合にVS Codeで
左右のペインで比較できることを知ってる人は少ない？（少なくとも、私は知らなかった）
ので、私は、その場合に、Windows PCで開発業中においてはWinmergeを多用していたが、
その場合に、macOSではどうすればいいのだろうというのが、当記事のテーマなのである。

問題：Mac 上で WinMerge 相当を無料で再現したい

ところが、Mac を使い始めてまず困ったのが、

上の 1〜3 の条件を全部満たす無料アプリが、なかなか見つからない

という点だった。

  • 無料・OSS の diff ツールはいくつかあるが、
    • 左右編集が制限されていたり
    • 外部変更のリロード時にスクロール位置が飛んだり
    • そもそも macOS では正式サポート外だったり
  • 有料ツール（高機能な diff / merge ツール）は、機能面では WinMerge 以上に優秀なものもあるが、
    • 個人ライセンス前提になっているものが多い
    • 「現場で貸与された Mac」上で個人所有ライセンスを勝手に入れて良いのかは、現場のポリシー次第

せっかくお金を払って特定ツールに依存したスキルを積み上げても、

現場の貸与 Mac に入れられない → 使えない

という懸念が残る。

そこで、

「Windows でも macOS でも Linux でも、どこに行っても入れやすいツール1つで WinMerge 的なことができないか？」

という視点で調べ直した結果、
VS Code の標準機能だけでかなり良い線まで行けることが分かった。

VS Code の diff を「WinMerge 的」に使うという発想

VS Code を日常的に使っていると、

  • Source Control（Git）の「Changes」からファイルをクリックして
  • 左右に HEAD vs 作業ツリーの diff を出す

というのは、よくあると思う。

この Git の diff 画面は、

  • 右側（作業ツリー側）はその場で編集・保存できる
  • 編集すると自動で差分が再計算される
  • スクロール位置は維持される

という意味で、WinMerge に挙動が近い。

では、

「Git 関係なしに、適当な 2 ファイルを指定して同じような diff 画面を出せないか？」

という発想で VS Code を調べると、実は標準でちゃんと用意されている。

2つのテキストファイルを VS Code で diff 表示する方法

コマンドラインから code --diff を使う

CLI から VS Code が使える状態（code コマンドが通っている状態）なら、
Windows / macOS / Linux 共通で次のように呼べばよい。

code --diff path/to/file1.txt path/to/file2.txt

これだけで、VS Code が起動して 2つのファイルの diff ビュー が開く。

  • すでに VS Code が起動している場合は、そのウィンドウに新しい diff タブが追加される
  • file1/file2 の中身はどちらも通常のファイルと同じ扱いなので、左右どちら側も編集・保存できる

GUI からファイル同士を比較する

CLI を使いたくない場合は、GUI だけでも同じことができる。

  1. VS Code のエクスプローラで、比較元のファイルを右クリック
    → 「Select for Compare」（比較対象に選択）を選ぶ
  2. 比較したいもう一方のファイルを右クリック
    → 「Compare with Selected」（選択したものと比較）を選ぶ

これで、同じく 2 ファイルの diff ビューが開く。

まずは「左右表示」になるように設定を確認する

VS Code の diff は、表示モードが2種類ある。

  • side-by-side（左右に2ペイン）
  • inline（1ペインに上下で赤/緑の差分）

WinMerge 的に使いたいので、常に side-by-side（左右表示）になるように固定 しておく。

設定画面を開く

  1. VS Code で Ctrl+,（macOS は Cmd+,）を押して設定を開く

  2. 設定画面右上の検索ボックスに、次のように入力する

    diffEditor.renderSideBySide

→ 「Diff Editor: Render Side By Side」が表示される。

設定項目1：Diff Editor: Render Side By Side

  • 意味
    diff エディタを左右に表示するか、インライン表示にするかという基本スイッチ。
  • 操作
    「Diff Editor: Render Side By Side」にチェックを入れる（ON）。

これで「基本的には左右表示」のモードになる。

設定項目2：Diff Editor: Render Side By Side Inline Breakpoint

同じ画面に、次の項目も出ているはず。

  • Diff Editor: Render Side By Side Inline Breakpoint

ここが今回のハマりポイントだった。

この値の意味

公式の説明を要約すると：

diff エディタの幅がこの値より小さいときは、side-by-side ではなく inline 表示に切り替える

というもの。

例えばデフォルトが 900 の場合、

  • diff タブの横幅が 900px 以上 → 左右表示
  • diff タブの横幅が 900px 未満 → 強制的に inline 表示

になる。

なぜ 0 にした方が分かりやすいか

WinMerge 的に 「常に左右表示で使いたい」 なら、ここに 0 を入れておくのが一番シンプルだと思う。

  • 値を 0 にする
    → 「幅が 0 未満のときだけ inline」になる
    → 実質、常に side-by-side になる

こうしておくと、

  • ウィンドウを多少狭くしても勝手に inline に切り替わらない
  • 「あれ？さっき左右だったのに、いつの間にか上下表示になってる」という混乱が起きない

というメリットがある。

ここまで設定すれば、WinMerge 的にかなり近い挙動になる

以上の設定が済んだ状態で、

code --diff path/to/file1.txt path/to/file2.txt

または GUI から

  • 「Select for Compare」
  • 「Compare with Selected」

を実行すると、次のような挙動になる。

1. 2つのファイルが左右に並んで差分表示される

  • 左に file1、右に file2（順番は渡し方による）
  • 変更行は色付きでハイライトされる
  • 上部の矢印ボタンで差分単位のジャンプができる

2. 左右どちらのペインも編集・保存できる

この diff ビューは「2つの通常のテキストエディタを横に並べたもの」なので、

  • 左右どちらにもカーソルを置いて編集できる
  • Ctrl+S / Cmd+S で普通に保存できる
  • 保存した瞬間に、差分表示が再計算される

WinMerge で「左右どっちもその場で編集して保存 → 即差分に反映」という使い方をしていた人は、ほぼ同じ感覚で使える。

3. 別エディタで変更しても、自動で再読み込みされる

diff 画面を開いたまま、

  • 別の VS Code ウィンドウや他のエディタ、ターミナルなどから、比較対象ファイルを更新して保存する

ということをすると、VS Code はファイルシステム上の変更を検知して、

  • 未保存の変更がなければ、そのまま自動リロードしてくれる
  • diff 表示も自動で再計算される

挙動としては、

WinMerge で「外部変更がありました。再読み込みしますか？」→「はい」を押した

のと同じような形で、差分表示が最新状態に追従する。

4. リロード後も、縦スクロール位置は基本的に維持される

VS Code のエディタは、外部変更によるリロード後も、
カーソル位置やスクロール位置を可能な限り維持する 仕様になっている。

diff ビューもそれに従うので、

  • 画面の真ん中あたりの差分を見ている状態で
  • 片方のファイルを編集・保存
  • VS Code が差分を再計算

となっても、基本的に見ていた位置からいきなり先頭に飛んだりはしない。

ここが WinMerge の「リロードしてもスクロール位置維持」とかなり感覚が近いところ。

Windows / macOS / Linux で共通して使える

ここまで書いてきたやり方は、

  • VS Code が動いていて
  • code コマンドが使える環境なら

Windows / macOS / Linux のどれでも同じ である。

  • Windows：code --diff も設定名も同じ
  • macOS：code コマンドをインストールしていれば同様
  • Linux：パスの違いはあっても、VS Code の設定と diff 機能は共通

つまり、「どの OS でも VS Code さえ入れておけば、WinMerge 的な 2ファイル比較を再現できる」という状態にできる。

まとめ

  • WinMerge の

    • 2ファイル左右比較
    • 左右どちらも編集・保存
    • 外部変更の反映
    • スクロール位置維持
      というワークフローは、私にとって開発作業の必需品だった。

  • macOS でこれを完全に無料ツールだけで再現するのは難しいと思っていたが、
    VS Code の標準 diff 機能だけで、かなり近い体験が得られる。

  • ポイントは次の2つの設定だけ。

    Diff Editor: Render Side By Side → ON
    Diff Editor: Render Side By Side Inline Breakpoint → 0

  • これさえ済ませておけば、

    code --diff fileA fileB

または GUI の

  • 「Select for Compare」
  • 「Compare with Selected」

だけで、Windows / macOS / Linux いずれでも WinMerge 的な 2ファイル比較エディタとして VS Code を使える。

以上、
「貸与された Mac」でも、
自分の この Zenn の記事を開いて手順どおりに進めるだけで、
いつも、よく利用してる2つのファイルの比較に限定すれば、
WinMerge にかなり近い環境をすぐ再現できるはず。

結論に至るまでの過程で見送ったアプリ

  • 無料・OSS の diff ツールで検討したもの
    （WinMerge の 4 条件との比較と、今回見送った理由）

    ここでの「WinMerge の 4 条件」は、この記事で自分が重視している次の4つです。

    1. 2つのファイルを左右に並べて差分表示できる
    2. 比較画面の左右どちらのペインも、その場で編集・保存できる
    3. 別エディタ等でファイルを編集・保存したとき、変更を検知して再読み込みされる
    4. 再読み込み後も、縦スクロール位置が維持されたまま差分だけ更新される

    ※以下の「○ / △ / ×」は
    「WinMerge と同レベルで満たしていると、自分が安心して言い切れるか」という観点での評価です。

    • Meld

      • 概要
        • GNOME プロジェクト製の visual diff / merge ツール。
          Linux では定番だが、macOS / Windows 向けのビルドも一応存在する。
      • WinMerge の 4 条件との比較
        • (1) 2ファイル左右比較：○（2-way / 3-way diff あり）
        • (2) 左右どちらも編集・保存：○ 寄り（テキスト編集は可能だが、エディタとしての使い勝手は VS Code ほどではない）
        • (3) 外部変更検知と再読み込み：△（外部変更の検知はあるが、WinMerge と同等に安定して使えるか、macOS + 日本語環境での実例が少ない）
        • (4) 再読み込み後の縦スクロール位置維持：？〜△（少なくとも「WinMerge 同等にスクロール位置を保証する」と明言している一次情報は見つけにくい）
      • 今回見送った理由
        • macOS では GTK とその周辺を Homebrew などで入れて動かす必要があり、業務用の貸与 Mac に長期的に入れ続けられるか という意味で不安が残る。
        • 上記 (3)(4) について、WinMerge 同等だと自信を持って言い切れるだけの情報が集まらなかった ため、
          「誰にでもすすめられる無料解」として採用するのはやめた。

    • KDiff3

      • 概要
        • Qt ベースの diff / merge ツール。2-way / 3-way diff、フォルダ比較などを備えている。
        • Windows / Linux / macOS 版があるが、macOS ビルドはやや古い印象。
      • WinMerge の 4 条件との比較
        • (1) 2ファイル左右比較：○
        • (2) 左右どちらも編集・保存：△（編集自体は可能だが、「エディタとして常用したいか」という観点では WinMerge / VS Code より弱い）
        • (3) 外部変更検知と再読み込み：△（機能はあるが、最新 macOS / Apple Silicon での挙動が安定しているか判断材料が不足）
        • (4) 再読み込み後の縦スクロール位置維持：？（公式ドキュメント等で明確に保証されているわけではない）
      • 今回見送った理由
        • macOS 向けの更新頻度や、Apple Silicon での将来のサポート状況が読みづらい。
        • 特に (3)(4) について、WinMerge と同等と言い切る根拠が薄い ため、
          VS Code 標準機能で代替できるなら、あえて KDiff3 を前面に出す必要はないと判断した。

    • P4Merge

      • 概要
        • Perforce 社が提供する無償の diff / merge ツール。
          macOS 版も公式に配布されており機能はかなり豊富。
      • WinMerge の 4 条件との比較
        • (1) 2ファイル左右比較：○
        • (2) 左右どちらも編集・保存：△（比較ビューからの編集は可能だが、「テキストエディタとして常用する」用途は想定していない作り）
        • (3) 外部変更検知と再読み込み：○〜△（外部変更検知はあるが、WinMerge と同じ感覚で「はい」→即スクロール維持、という使い心地かは要検証）
        • (4) 再読み込み後の縦スクロール位置維持：？（ここをウリにしている情報は特に見当たらない）
      • 今回見送った理由
        • 利用は無料だが、ライセンスは OSS ではなく Perforce の使用許諾に従う必要 がある。
        • 社内ポリシーによっては「個人判断で追加ツールを入れにくい」ケースも想定される。
        • 結果として、VS Code だけで WinMerge 的な使い方が実現できるなら、P4 系ツールを新たに覚える必要は薄い と判断し、記事の主役からは外した。

    • DiffMerge (SourceGear)

      • 概要
        • SourceGear が提供していた GUI diff / merge ツール。
          Windows / macOS / Linux 向けにバイナリが配布されていたが、更新はかなり古い。
      • WinMerge の 4 条件との比較
        • (1) 2ファイル左右比較：○
        • (2) 左右どちらも編集・保存：△（エディタとして常用するには機能が物足りない）
        • (3) 外部変更検知と再読み込み：△〜×（古いツールであり、最新環境での安定動作を期待しづらい）
        • (4) 再読み込み後の縦スクロール位置維持：？（少なくとも WinMerge 同等と期待するのはリスクが高い）
      • 今回見送った理由
        • 開発が事実上止まっている状態で、最新 macOS / Apple Silicon への対応が保証されない。
        • 「これから新規に導入して、数年スパンで使い続ける」前提で推すには、将来性の面で厳しい。
        • その一方で VS Code は継続的にアップデートされ続けており、
          「どうせ学ぶなら VS Code の diff を押さえておいた方が、ツール寿命的にも得」と判断した。

  • 有料ツールで検討したもの
    （機能面では有力だが、ライセンスの都合で今回は採用せず）

    ※どれも WinMerge の 4 条件をかなり高いレベルで満たしている と考えられるが、
    「個人ライセンス前提になりがち」「現場の貸与 Mac に自由に入れられるとは限らない」
    という理由で、この記事の「誰でも真似できる無料解」という趣旨からは外している。

    • Beyond Compare

      • 概要
        • Scooter Software 社の商用 diff / merge ツール。
          Windows / macOS / Linux 対応、2-way / 3-way diff、フォルダ比較など非常に高機能。
      • WinMerge の 4 条件との比較
        • (1) 2ファイル左右比較：○（フォルダ比較も含め、視認性の高い UI）
        • (2) 左右どちらも編集・保存：○（テキストとして普通に編集・保存可能）
        • (3) 外部変更検知と再読み込み：○（外部で保存した変更も検知・反映できる）
        • (4) 再読み込み後の縦スクロール位置維持：○ 寄り（実際の使い勝手として WinMerge にかなり近い、という評価が多い）
      • 今回採用しなかった理由
        • ライセンスは買い切りとはいえ 完全な商用ソフト であり、
          「自分が個人購入したライセンスを、会社貸与の Mac に勝手に入れてよいか」は組織の規定による。
        • 記事のゴールは「VS Code だけで WinMerge 的なワークフローを再現する」ことであり、
          Beyond Compare は「高機能な有料代替」として名前だけ挙げるに留めた。

    • Araxis Merge

      • 概要
        • Windows / macOS に対応したプロ向け diff / merge ツール。
          2-way / 3-way diff、フォルダ同期、レポート機能などを備える。
      • WinMerge の 4 条件との比較
        • (1) 2ファイル左右比較：○
        • (2) 左右どちらも編集・保存：○（編集用の UI がしっかり用意されている）
        • (3) 外部変更検知と再読み込み：○（プロ向けツールとしての期待どおりの挙動）
        • (4) 再読み込み後の縦スクロール位置維持：○ 寄り（レビュー等を見る限り、長文ファイルでも作業位置を維持したまま差分更新しやすい）
      • 今回採用しなかった理由
        • 完全な商用ライセンスで、価格もそれなり。
        • 個人で買って慣れても、「現場の貸与 Mac に入れて良いか」は会社次第で再現性がない。
        • 「VS Code の標準機能だけで、かなりのところまで行ける」と分かった時点で、
          Araxis Merge は「もし会社で配布されていたらラッキー」枠として扱うことにした。

    • Kaleidoscope

      • 概要
        • macOS 専用のビジュアル diff / merge ツール。
          Git 連携や画像比較など、Mac 向けに UI が作り込まれている。
      • WinMerge の 4 条件との比較
        • (1) 2ファイル左右比較：○
        • (2) 左右どちらも編集・保存：○（テキストのインライン編集可能）
        • (3) 外部変更検知と再読み込み：○（macOS ネイティブアプリとして期待どおりの挙動）
        • (4) 再読み込み後の縦スクロール位置維持：○ 寄り（長文比較でもストレス少なく作業しやすい、というレビューが多い）
      • 今回採用しなかった理由
        • サブスクリプション／買い切りいずれにしても 有料ライセンス前提。
        • 「会社支給の Mac で、個人アカウントのサブスクを使っていいか？」という問題が残る。
        • この記事の目的は、「VS Code さえ入っていれば OS を問わず再現できる無料ワークフロー」を確立すること なので、
          Kaleidoscope は「Mac 専用のリッチな選択肢」として名前を挙げるだけに留めた。

Discussion