【VSCode】LiveServerでローカルサーバーが起動しない時の対処法

VSCodeには、HTML/CSSのコードをブラウザ上で即プレビューしてくれる"LiveServer"という拡張機能が存在する。

 

非常に便利な機能だが、使用する際には注意点がある。

 

それは、プレビューされないこと。

 

htmlファイルを直接開いても、プレビューは起動してくれない。

f:id:nekokichi_yos2:20181026125740p:plain

 

下記のエラーでは、

「フォルダか、ワークスペースを開いてください」

と表示されている

f:id:nekokichi_yos2:20181026125743p:plain

 

 

対処法としては、編集したいhtmlファイルが入っている、フォルダを選択すればいい。

f:id:nekokichi_yos2:20181026125954p:plain

 

おそらく、cssなどの関連ファイルを参照しやすくするように、フォルダを開くように通知してるのかもしれない。

f:id:nekokichi_yos2:20181026125957p:plain

 

ブラウザ上でプレビューされます

f:id:nekokichi_yos2:20181026130108p:plain