2023.08.14 2025.01.16

【VSCode】Live Serverが動かなくなったときにやったこと

hotaru

記事内に商品プロモーションを含む場合があります

しばらく取り組んでいたデザイン案件が一段落して、久しぶりにコーディング案件に着手しようとしたらVSCodeのアップデート通知が。

そのままアップデートしたところ、Live Serverがブラウザ側で一切反応しなくなる事態に。復旧させるためにいろいろ調べたり試したりしていたらあっという間に数時間経過してしまい、その日のモチベーションを失いました。

また同じことが起こったときのために、試したことをメモ。

この記事の目次

最初に試したこと

少し前に記述を少しいじった記憶があったので中身を確認。特に問題なし。

滅多に触らないので可能性は低いと思いつつも、念のためChromeの拡張機能「Live Server Web Extension」側の設定もチェック。こちらも問題なし。

直近でアップデートがあったなら最新のVSCodeとの相性が悪いのかも？と思ったものの、Live Server側のアップデートは久しく行われていなかった模様。

VSCodeの再起動も挟みつつ何度か繰り返したものの変化なし。このあたりで詰み始める。

最終手段で、Live Serverを一旦アンインストールして入れ直し。

これでどうにかなるだろうと思い再びブラウザで動作確認をしようとしたところ、さっきまでステータスバーにあったはずの「Go Live」ボタンがない。

ボタンが表示されないのは初めてだったので、予期せぬ事態に大慌て。

まずはボタンを元に戻さないと話にならないので調べたものの、解決方法が見つからない。

「VSCode Live Server Go Live 表示」のようなキーワードで検索しても、出てくるのは「ファイル単体じゃなくてフォルダで開けば解決」といった記事ばかり。私は基本的にプロジェクトフォルダごと開いているので、これは関係なしでした。

予想外のところで大幅に時間をロスすることに。

検索の限界を感じ、初心にかえってLive Server自体の設定を見直していたところ、怪しげな項目を発見。

Live Server › Settings: Show On Statusbar
Change this to false if you don’t want the button to show in the statusbar

これは！と思い、外れていたチェックを入れてVSCodeを再起動。すると…

出てきた！！！！

チェックを入れただけではボタンは表示されず、再起動したら反映されました

話がだいぶ逸れましたが、「Go Live」ボタンを復活させた後に改めてブラウザで動作確認をしたところ無事に自動更新されるようになり、ようやく元通りに。長い道のりでした。

原因の直接の解消に繋がったのかは分かりませんが、動作が復活したタイミングから考えると、今回はLiver Serverの再インストールが効いた可能性が高そうです。
Go Liveがなくなるという更なるトラブルもありましたが、これもまた勉強。

Profile