VSCode内でテキスト比較(diff)する3つの方法

VScodeのテキスト比較(diff)する3つの方法の紹介を紹介します。

1つ目はVSCodeで標準に備わっているテキスト比較の使い方で実用的ではないかもしれませんが、操作方法だけでも覚えておくと後から役立つかもしれません。

2つ目と3つ目は実際の仕事でも使えそうな実用的な方法です。ぜひ、実際に導入してみて使い勝手を試してもらえたらと思います!

はにわまん
コーダーは割とテキスト比較を行うので、ここの効率化も課題だったりします><

VSCodeのテキスト比較する3つの方法

VSCodeのテキスト比較する3つの方法です。VSCodeの標準機能として備わっているテキスト比較から紹介して、それらを応用して作られた(であろう)拡張機能を使った比較を紹介していきます。

2つのファイルを単純に比較

存在するファイルを2つ比較するには「選択項目の比較」というVSCodeの標準機能を使うことで実現できます。

ファイルをCtrlを押しながら2つ選択して、右クリックから「選択項目の比較」を選択します。

エクスプローラーからファイルを複数選択します。

右クリックして、「選択項目の比較」を選びます。

2画面となって異なる箇所が強調されているのが分かります。

VSCodeには、こんな感じで標準的にdiffの機能が備わっています。

前の保存時のファイルと今を比較

「Local History」という拡張機能を使えば、保存時のファイルを残しておけます。バージョン管理の簡易版みたいなイメージの拡張機能です。

ダンロード先 → Local History – Visual Studio Marketplace

保存すると、同じプロジェクトフォルダ内の.hitstoryフォルダにどんどんバックアップファイルが追加されていきます。

比較方法は2つあって、.hitstoryの中のファイルと今のフィイルを比較して先ほど紹介した「選択項目の比較」を行う方法。もう1つは、「Local History」の管理メニューを新たに追加して比較の操作をする方法です。

「選択項目の比較」のパターン

これは、最初に紹介したやり方と全く同じです。

「Local History」を使っている間は.hitstoryフォルダに物理的に保存時のファイルがバックアップとして追加されていくので、今のファイルと.hitstory内のフィアルを選択して「選択項目の比較」を行うだけです。

専用のメニューを追加するパターン

設定を変更することで、サイドメニューのエリアに専用のメニューを追加することができます。

ファイル → 基本設定 → 設定 から「Local History」で検索。「Tree Location」を「localHistory」に変更して保存します。

対象のフィアルを開いた状態でサイドメニューの「Local History」を開くと、選択したバックアップファイルとのテキスト比較ができるようになっています。

バックアップしつつ比較もできるので、普通に作業するよりは安心感をもって作業できるかもしれません。

前回のコミット時のファイルと比較

「Local History」は保存するたびに強制的にバックアップフィアルが作られます。そこまでの頻度は必要ないなって思う方もいるかもしれません。

Gitで最低限の管理がされていることが前提になってしまいますが、、、「GitLens」という拡張機能を使えば、簡単に前回コミットした状態と今の状態を比較することができるようになります。

ダウンロード先 → GitLens — Git supercharged – Visual Studio Marketplace

対象フィアルを右クリック → 「Open Changes with Previous Revision」を選択するだけで、差分を確認することができます。

左側に前回のコミットした同ファイルとの比較が表示されます。

ファイルをGitで管理している方は「GitLens」を使い、特に管理していない方(物理的なバックアップで管理している方)は「Local History」が使いやすいのかなと思います。

おわり

VSCodeのテキスト比較(diff)する3つの方法の紹介でした!

「Local History」や「GitLens」など、素敵な拡張機能も豊富でVSCodeからますます離れられませんね…。標準でdiff機能が備わっているので、テキスト比較も基本的にはVSCode内で完結できてしまいます。

使えそうな拡張機能があったら、実際に導入してみてポチポチ触って試してみてください!

このページが役に立ったら
いいね!お願いします

運営の励みになります...。

関連の記事