VS Codeでプログラミングを始めたばかりの人から、よくこんな質問をいただきます。
「コードを書いたけど、どうやって上書き保存するの？」
「自動保存にしたいんだけど設定方法がわからない」
実は、VS Codeでの上書き保存はとても簡単です。
基本的なショートカットキーを覚えるだけで、すぐに使えるようになります。
この記事では、VS Codeでの上書き保存の方法と、自動保存設定の手順をわかりやすく解説します。
記事を読み終わる頃には、VS Codeでの保存操作に困ることはなくなるでしょう。
VS Codeで上書き保存するショートカット
VS Codeでファイルを上書き保存するのは、どのエディタでもおなじみのショートカットキーです。
Windowsの場合
Ctrl + S
Macの場合
Cmd + S
Linuxの場合
Ctrl + S
これらのキーを押すだけで、現在開いているファイルが上書き保存されます。ファイルが未保存の場合は、ファイル名の横に白い点が表示されますが、保存すると消えます。
保存時に便利な機能
保存時にコード整形（フォーマット）
VS Codeでは、上書き保存と同時にコードを自動で整形できます。これは「フォーマット」と呼ばれる機能で、インデントや改行を統一してくれます。
設定方法は以下の通りです：
Ctrl + ,（MacはCmd + ,）で設定画面を開く- 検索欄に「format on save」と入力
- 「Format On Save」にチェックを入れる
または、settings.jsonに以下のコードを追加します：
{
"editor.formatOnSave": true
}
この設定をオンにすると、Ctrl + S（Cmd + S）を押すだけで、自動的にコードがきれいに整形されます。
保存時のその他の便利機能
VS Codeでは、保存時に以下の機能も使えます：
- 保存時にインポート文を整理: 使わないimport文を削除
- 保存時に末尾の空白を削除: 余分なスペースを自動削除
- 保存時にファイル末尾に改行追加: ファイルの終わりに改行を追加
これらの機能もsettings.jsonで設定できます。
自動保存（Auto Save）を設定する方法
「保存するのを忘れやすい」という人には、自動保存機能がおすすめです。設定すると、一定の条件で自動的にファイルが保存されます。
設定画面から自動保存を有効にする
Ctrl + ,（MacはCmd + ,）で設定画面を開く- 検索欄に「auto save」と入力
- 「Files: Auto Save」の項目を見つける
- 以下のオプションから選択する：
- off: 自動保存しない（デフォルト）
- afterDelay: 一定時間後に自動保存
- onWindowChange: 他のアプリに切り替えたときに保存
- onFocusChange: エディタのフォーカスが変わったときに保存
自動保存のタイミングを詳しく解説
afterDelay（一定時間後）
設定した時間が経過すると自動的に保存されます。デフォルトは1000ms（1秒）です。
onWindowChange（ウィンドウ変更時）
VS Codeから他のアプリケーションに切り替えたときに保存されます。ブラウザでテストするときなどに便利です。
onFocusChange（フォーカス変更時）
エディタ内で別のファイルを開いたときや、サイドバーをクリックしたときなどに保存されます。
settings.jsonで細かく設定する
より細かい設定をしたい場合は、settings.jsonに直接記述します：
{
"files.autoSave": "afterDelay",
"files.autoSaveDelay": 1000
}
この設定では、1秒（1000ms）間隔で自動保存されます。autoSaveDelayの値を変更することで、保存間隔を調整できます。
上書き保存でよくある質問
保存されているかどうかを確認する方法
ファイルが保存されているかどうかは、タブの表示で確認できます：
- 未保存: ファイル名の横に白い点が表示される
- 保存済み: 白い点が表示されない
複数のファイルを一度に保存する方法
複数のファイルを開いている場合は、以下のショートカットで全て保存できます：
- Windows/Linux:
Ctrl + K, S - Mac:
Cmd + K, S
保存に失敗する場合の対処法
保存に失敗する場合は、以下を確認してください：
- ファイルの書き込み権限があるか
- ディスク容量が足りているか
- ファイルが他のプログラムで開かれていないか
まとめ
VS Codeでの上書き保存は、以下の方法で簡単に行えます：
- 手動保存:
Ctrl + S（MacはCmd + S） - 自動保存: 設定画面で「Files: Auto Save」を有効にする
- 保存時フォーマット: 「Format On Save」で保存時にコードを整形
コメント