「ある日突然、VS Codeが重い…。」
普段は快適に使えていたのに、急に起動や入力がもたつくようになりました。
キャッシュや拡張機能の影響かも？と調べて、いろいろ試してみましたが、どれが効くのか分からず迷走…。
最終的に再インストールで改善しました。
動作が軽くなり、作業もスムーズに戻り、快適になりました。
この記事では、再インストールまでに試した対処法や、再セットアップのポイントを初心者向けにまとめています。
この記事が「なんで急に重くなったの?」と悩んでいる方の気づきになると嬉しいです。
VS Codeが重いときにまず確認したい5つのポイント
① 拡張機能を見直す
拡張機能はとても便利で、ついつい増やしがちです。
使っていない拡張機能がたくさんあると、VS Codeの動作が重くなることがあります。
まずは、使っていない拡張機能を一時的に無効にするか、思いきって削除してみましょう。
少し軽くなるだけでも、作業がスムーズになります。
チェックリスト
②ワークスペース・フォルダの構成を見直す
開いているファイルが多すぎると、VS Codeに負荷がかかって動作が重くなります。
なるべく不要なファイルは外して、必要なものだけに絞って開くのがおすすめです。
チェックリスト
③設定ファイル（settings.json）を初期化する
設定が増えてくると、VS Codeに負荷がかかり、動作が重くなることがあります。
そんなときは、一度初期化してみると効果的です。
チェックリスト
※ settings.json の中身を コピーしてメモ帳や VS Code にペーストしておくだけで、バックアップや再利用が可能です。
JSONは「,（カンマ）抜け」や「””の閉じ忘れ」でエラーになりやすいので注意してね。
④キャッシュ・一時ファイルを削除する
VS Codeは、キャッシュや一時ファイルを自動的に保存しています。これらが溜まりすぎると動作が重くなることがあります。
キャッシュをクリアすることで、動作が軽くなることがあります。
チェックリスト
⑤VS Codeのプロセスを整理する（バックグラウンドを減らす）
ターミナルやサーバーなどを開いたままにしていると、VS Codeが重くなる原因になります。
使わないものはこまめに閉じて、メモリの負担を軽くしておきましょう。
チェックリスト
それでもダメなら再インストール｜手順をわかりやすく解説
まずは、アンインストールをします。
その次に再インストールをします。
VS Codeをアンインストールする手順
起動中のアプリは閉じてください。
- Windows：
「スタート」→「設定」→「アプリ」→「アプリと機能」から「Visual Studio Code」を選んでアンインストール - Mac：
「アプリケーション」フォルダから「Visual Studio Code.app」をゴミ箱へ移動
以下のフォルダを削除すると設定やキャッシュも消えます。
※不要なトラブルシューティングを目的にする場合のみ実行してください。
Windowsの場合
%APPDATA%\Code
%LocalAppData%\Code
Macの場合
~/Library/Application Support/Code
~/Library/Caches/com.microsoft.VSCode
削除後は再起動して環境をリセットすると安心です。
設定や拡張機能のバックアップは必要？（基本的に不要です）
VS Codeは、MicrosoftアカウントやGitHubでログインしておくと、設定や拡張機能を自動で同期してくれます。
同期していなくても、アンインストールしても設定は残ることが多いので、基本的には心配いりません。
設定をいろいろ変更している人は、「settings.json」をバックアップしておくと安心です。
もし何かあっても、すぐに元の状態に戻すことができます。
再インストールの方法
少し待つと、ダウンロードフォルダにzipファイルが保存されます。
このファイルをダブルクリックして解凍すると、アイコン付きのVS Code本体が出てきます。
あとは、このアイコンをアプリケーションフォルダへドラッグ＆ドロップすれば、インストール完了です。
VS Codeが起動します。
アップデートをしておこう｜VS Code最新版にする方法
基本は自動アップデート、でも確認してみよう
VS Code は通常、自動で最新バージョンにアップデートされます。
でも、気づかないうちに古いバージョンのまま使っていた、ということがあります。
実は私もそうでした。
「再インストールまではちょっと不安…」という方は、
まずこの手動アップデートだけでも試してみるのがおすすめです。
最新バージョンにすることで、動作が軽くなったり、不具合が解消されることもあるので、ぜひチェックしてみてくださいね。
アップデートされているか調べる方法
【Mac】Code → 更新の確認
【Windows】ヘルプ→ 更新プログラムの確認
私の場合、「更新はありません」と表示されました。
初心者にもおすすめ｜軽くて便利なVS Code拡張機能5選
今回は、拡張機能をたくさん入れていたこともあって、再インストール後は、本当に使いたいものだけを厳選して入れ直しました。
そこで、軽くて実用的な初心者向けおすすめ拡張機能を5つご紹介します。
①Prettier – Code Formatter
コードの見た目を自動できれいに整えてくれる便利なツールです。
スペースや改行のズレも、しっかり直してくれます。
インストールはこちらPrettier – Code Formatter
②HTMLHint
HTMLの構文ミスを自動でチェックしてくれる拡張機能です。
タグの閉じ忘れなどの基本的なミスにもすぐ気づけるので、初心者の方や学習中の方にもおすすめです。
③CSSTree Validator
CSSの書き間違いを自動でチェックしてくれるツールです。
余分なプロパティやスペルミスにも気づかせてくれるので、安心してコーディングが進められます。
④zenkaku（全角スペース強調）
ふだん見えにくい全角スペースもわかりやすく表示してくれるので、ミスにすぐ気づけます。
⑤Bracket Pair Colorizer 2
カッコを色で分かりやすくしてくれる拡張機能です。
カッコが多くても、どれとどれが対応しているのかすぐに確認できます。
インストールはこちらBracket Pair Colorizer 2
まとめ：再インストールしてよかった｜これからも快適に使っていこう
作業中にVS Codeが重くなってしまい、かなり困っていました。
いろいろな対処法を試してみたものの、なかなか改善せず……。
最終的に、思いきって再インストールを選びました。
その結果、以前よりスムーズに動くようになり、少しほっとしています。
これからは重くならないよう、不要な拡張機能を整理したり、設定を見直したりしながら
快適な開発環境を保っていきたいと思います。
最後まで、お読みいただきありがとうございます。