VSCodeのLocal Historyは、ファイルを保存した時点の内容をローカルに履歴として残し、あとから過去の状態を確認したり復元したりできる機能です。
コードを誤って上書きしてしまった場合や、リファクタリング前の状態に戻したい場合などに役立ちます。
Local HistoryはVSCode 1.66から標準機能として搭載されているため、基本的に専用の拡張機能をインストールする必要はありません。
ただし、Local HistoryはGitのような本格的なバージョン管理機能ではありません。
あくまで、作業中の変更を復旧するための補助的な機能として考えるのが適切です。
VSCodeのLocal Historyでできること
Local Historyを利用すると、主に以下のような操作ができます。
- 過去に保存したファイルの内容を確認する
- 現在のファイルと過去の内容を比較する
- 過去の状態へファイルを復元する
- Local Historyのエントリ名を変更する
- 不要な履歴を削除する
- 誤って削除したファイルを復元できる場合がある
特に、Gitへコミットしていない変更でも、Local Historyに履歴が残っていれば復元できる可能性があります。
参考サイト
編集履歴をたどれるようになった「Visual Studio Code」2022年3月更新（v1.66） – 窓の杜
Local HistoryとGitの違い
Local HistoryとGitは、どちらも過去の状態へ戻るために利用できますが、役割は大きく異なります。
Local Historyは作業中の復旧に向いている
Local Historyは、ファイルを保存したタイミングなどで履歴を自動的に残す仕組みです。
コミット操作を行わなくても履歴が残るため、作業途中の状態を復元したい場合に便利です。
たとえば、以下のようなケースで役立ちます。
- コードを間違えて上書きした
- 数十分前の状態へ戻したい
- リファクタリング前のコードを確認したい
- Gitへコミットする前の状態を復元したい
Gitは正式なバージョン管理に向いている
Gitでは、コミットやブランチ、マージなどを利用して、プロジェクト全体の変更履歴を管理できます。
GitHubやGitLabなどのリモートリポジトリと連携すれば、チームでコードを共有することも可能です。
そのため、基本的には次のように使い分けるとよいでしょう。
Local History
→ 作業中の変更を復旧するための保険
Git
→ プロジェクト全体の正式なバージョン管理
Local Historyだけに依存するのではなく、Gitと併用することが重要です。
VSCodeでLocal Historyを確認する方法
Local Historyは、VSCodeの「Timeline」から確認できます。
対象のファイルを開く
まず、履歴を確認したいファイルをVSCodeで開きます。
たとえば、以下のようなファイルが対象です。
index.html
style.css
app.js
main.py
基本的に、現在選択しているファイルに関連する履歴がTimelineに表示されます。
Explorerを開く
VSCode左側のExplorerを開きます。
Windows・Linuxでは、以下のショートカットを利用できます。
Ctrl + Shift + E
macOSでは、以下です。
Shift + Command + E
Timelineを展開する
Explorer内にある「TIMELINE」を展開します。
Timelineには、そのファイルに関連するイベントが時系列で表示されます。
Gitを使用しているプロジェクトでは、Local HistoryだけでなくGitのコミット履歴なども表示される場合があります。
Local Historyから過去の内容を確認する方法
Timelineを開くと、保存されているLocal Historyのエントリが表示されます。
確認したい履歴を選択する
日時などを確認し、参照したいLocal Historyのエントリを選択します。
たとえば、
5 minutes ago
30 minutes ago
2 hours ago
といった履歴が表示される場合があります。
Local Historyの各エントリには、その時点におけるファイル全体の内容が保存されています。
現在のファイルとの差分を確認する
Local Historyでは、過去の内容と現在のファイルを比較できます。
Diff Editorを利用すると、
過去のファイル
｜
現在のファイル
という形で変更点を確認できます。
たとえば、以前は次のコードだったとします。
const message = "Hello";
現在は以下のようになっている場合、
const message = "Hello World";
どの部分が変更されたのかを視覚的に確認できます。
すぐに復元するのではなく、まず差分を確認してから復元するのがおすすめです。
Local Historyからファイルを復元する方法
過去の内容に戻したい場合は、Local Historyのエントリから復元できます。
復元したい履歴を探す
対象ファイルを開いた状態で、ExplorerのTimelineを表示します。
日時などを確認し、戻したい履歴を探します。
Restoreを実行する
復元したいLocal Historyのエントリから、Restoreに相当する操作を実行します。
復元すると、その履歴に保存されていた内容が現在のファイルへ反映されます。
重要なファイルの場合は、復元前に現在の内容との差分を確認しておくと安全です。
削除してしまったファイルを復元する方法
Local Historyは、誤って削除してしまったファイルの復元に利用できる場合もあります。
Local History全体から履歴を探す
コマンドパレットなどから「Local History: Find Entry to Restore」を実行すると、Local Historyに保存されているエントリから復元候補を探せます。
たとえば、
ファイルを削除した
↓
ゴミ箱にも残っていない
↓
Local Historyから過去の内容を探す
といった使い方が可能です。
ただし、対象ファイルのLocal Historyが過去に作成されていなければ復元できません。
TimelineにLocal Historyだけを表示する方法
Gitを使用している場合、Timelineには複数種類の履歴が表示されることがあります。
その場合は、Timelineのフィルターを利用すると便利です。
Local Historyを絞り込む
TimelineのフィルターからLocal Historyのみを表示するようにすると、目的の履歴を見つけやすくなります。
Gitのコミット履歴が多いプロジェクトでは、特に有効です。
Local Historyを手動で作成する方法
Local Historyは通常、ファイルを保存した際などに自動的に作成されます。
一方で、任意のタイミングで手動作成することもできます。
コマンドパレットを開く
Windows・Linuxでは、
Ctrl + Shift + P
macOSでは、
Command + Shift + P
を押します。
Local History関連のコマンドを検索し、手動で履歴を作成できます。
たとえば、大規模な変更を始める直前に、
Before refactoring
など分かりやすい名前で履歴を残しておくと便利です。
Local Historyの設定を変更する方法
Local Historyには、保存件数やファイルサイズなどを調整する設定があります。
Local Historyの設定画面を開く
VSCodeのSettingsを開き、「Local History」と検索すると関連項目を確認できます。
Windows・Linuxでは、
Ctrl + ,
からSettingsを開けます。
設定はGUIだけでなく、settings.jsonから直接変更することもできます。
Local Historyを有効・無効にする方法
Local Historyの有効・無効は、以下の設定で変更できます。
"workbench.localHistory.enabled": true
trueで有効、falseで無効です。
通常は有効になっています。
無効にする場合は、以下のように設定します。
"workbench.localHistory.enabled": false
特別な理由がなければ、有効にしたまま利用するのがおすすめです。
保存するLocal Historyの件数を変更する方法
1ファイルあたりに保持する履歴の最大件数は、以下の設定で変更できます。
workbench.localHistory.maxFileEntries
既定値は50件です。
たとえば、最大100件まで保持したい場合は次のように設定します。
"workbench.localHistory.maxFileEntries": 100
ただし、これは必ず100件の履歴が作成されるという意味ではありません。
あくまで1ファイルあたりに保持するLocal Historyの最大数です。
Local Historyの対象になるファイルサイズを変更する方法
Local Historyには、履歴として保存する対象ファイルのサイズ上限があります。
設定項目は以下です。
workbench.localHistory.maxFileSize
既定値は256KBです。
この設定は、Local History全体の容量を指定するものではありません。
1つのファイルがLocal Historyの対象になる際の最大サイズを指定します。
サイズの大きなJSONファイルやログファイルなどを扱う場合は、この設定を確認するとよいでしょう。
特定のファイルをLocal Historyから除外する方法
Local Historyに保存したくないファイルは、以下の設定から除外できます。
workbench.localHistory.exclude
たとえば、
- ログファイル
- キャッシュファイル
- 自動生成ファイル
- 頻繁に更新されるファイル
などを必要に応じて除外できます。
ただし、これらが最初からすべて自動的に除外されているわけではありません。
プロジェクトの状況に応じて設定します。
mergeWindowとは
Local Historyには、短時間に繰り返された保存を統合するための設定があります。
設定項目は以下です。
workbench.localHistory.mergeWindow
既定値は10秒です。
たとえば、
12:00:00 保存
12:00:03 保存
12:00:07 保存
のように短時間で繰り返し保存した場合、保存するたびに必ず別々のLocal Historyが作られるとは限りません。
一定時間内の履歴は、直前のエントリ側へ統合される場合があります。
そのため、「保存回数＝Local Historyの件数」ではない点に注意しましょう。
Local Historyを一括削除する方法
Local Historyには、すべての履歴を削除するためのコマンドもあります。
内部的には以下のコマンドが利用されています。
workbench.action.localHistory.deleteAll
大量のLocal Historyをまとめて削除したい場合に利用できます。
ただし、一括削除すると必要な履歴も失われる可能性があります。
重要な履歴が残っていないか確認してから実行しましょう。
Local Historyはどこに保存されるのか
Local Historyは、通常プロジェクトフォルダの中ではなく、VSCodeのユーザーデータ領域に保存されます。
ローカル環境の場合
PC上の通常のファイルを編集している場合は、ローカル側のVSCodeユーザーデータ領域に履歴が保存されます。
そのため、プロジェクトフォルダ内に必ずLocal History用のフォルダが作成されるわけではありません。
Remote SSHなどの場合
Remote SSHなどを利用してリモート環境のファイルを編集している場合は、基本的にリモート側のユーザーデータ領域へLocal Historyが保存されます。
そのため、Remote SSHで作成されたLocal Historyを探す場合、ローカルPCだけを確認しても見つからないことがあります。
VSCode for Webの場合
一部のWeb環境では、Local Historyの保存にブラウザのIndexedDBが利用される場合があります。
利用環境によって保存場所が異なる点には注意が必要です。
Local HistoryとUndoの違い
Local HistoryとCtrl + ZによるUndoは、目的が異なります。
Undoは直前の編集を戻す機能
Undoは、現在の編集作業で行った操作を取り消す用途に向いています。
Windows・Linuxでは、
Ctrl + Z
macOSでは、
Command + Z
を利用します。
Local Historyは保存時点へ戻す機能
Local Historyは、保存された過去のファイル状態を確認・復元するための機能です。
たとえば、
コードを編集する
↓
保存する
↓
VSCodeを閉じる
↓
後日ファイルを開く
↓
以前保存した状態を確認する
といった場面ではLocal Historyが役立ちます。
Local Historyが表示されない場合の対処法
TimelineにLocal Historyが表示されない場合は、いくつか確認するポイントがあります。
Local Historyが有効になっているか確認する
まず、以下の設定を確認します。
"workbench.localHistory.enabled": true
falseになっている場合、Local Historyは作成されません。
ファイルを保存したか確認する
Local Historyは主にファイル保存時に作成されます。
編集しただけで一度も保存していない状態は、Local Historyに残っていない可能性があります。
Timelineのフィルターを確認する
TimelineのフィルターでLocal Historyが非表示になっていないか確認します。
Gitの履歴だけが表示される設定になっている場合、Local Historyが存在していても見えないことがあります。
ファイルサイズを確認する
対象ファイルが、
workbench.localHistory.maxFileSize
で指定されている上限を超えている場合、Local Historyの対象外になる可能性があります。
exclude設定を確認する
以下の設定で、対象ファイルが除外されていないか確認します。
workbench.localHistory.exclude
Local Historyを活用すると便利な場面
Local Historyは、日常的な開発作業のさまざまな場面で役立ちます。
大規模なリファクタリングを行う前
コードを大きく書き換える場合は、変更前の状態を残しておくと安心です。
Gitでブランチやコミットを作成するのが基本ですが、Local Historyを補助的に利用することで復旧手段を増やせます。
設定ファイルを書き換えるとき
以下のような設定ファイルは、小さな変更でもアプリケーションの動作に影響することがあります。
package.json
tsconfig.json
settings.json
vite.config.js
webpack.config.js
変更後に問題が発生した場合、Local Historyを使えば変更前との差分を確認できます。
Gitへコミットする前
Gitを利用していても、コミットとコミットの間に行った細かな変更はGit履歴には残りません。
Local Historyに保存されていれば、コミット前の途中状態を確認できる場合があります。
Local Historyを利用するときの注意点
Local Historyは便利ですが、バックアップやGitの代わりとして利用するべきではありません。
Local Historyも失われる可能性がある
Local Historyは基本的にローカルまたはリモート環境のユーザーデータ領域へ保存されます。
そのため、
- PCやストレージの故障
- OSの再インストール
- VSCodeのユーザーデータ削除
- リモートサーバーの初期化
- Local Historyの一括削除
などによって履歴を失う可能性があります。
Gitやリモートリポジトリと併用する
安全性を高めるには、以下のような運用がおすすめです。
Local History
+
Git
+
GitHub・GitLabなどのリモートリポジトリ
Local Historyは「作業中のセーフティネット」、Gitは「正式な変更履歴」として使い分けるとよいでしょう。
VSCodeのLocal Historyを使う基本的な流れ
Local Historyの基本操作は、次の流れで覚えておくと分かりやすいです。
1. 履歴を確認したいファイルを開く
↓
2. Explorerを開く
↓
3. Timelineを展開する
↓
4. Local Historyのエントリを探す
↓
5. 現在のファイルとの差分を確認する
↓
6. 必要に応じて過去の内容を復元する
VSCodeのLocal Historyは、ファイルを保存した時点の内容を自動的に残し、あとから比較・復元できる便利な機能です。
特に、コードを誤って上書きした場合や、Gitへコミットする前の状態に戻りたい場合に役立ちます。
ただし、Local Historyは本格的なバージョン管理やバックアップ機能ではありません。
GitやGitHubなどと併用しながら、開発作業中のトラブルに備えるための補助機能として活用するのがおすすめです。
以上、VSCodeのLocal Historyとはについてでした。
最後までお読みいただき、ありがとうございました。
