gakkie プログラミング 備忘録

tech::expert(現tech camp) 45期

Visual Studio Codeを使いブラウザでhtmlをプレビューしたい

Visual Studio Code導入

色々パッケージを入れながら試していた。

sublimetext3のようにブラウザで実際に書いたJSを確認したいと思い調べてみた結果

Live HTML Previewerが使いやすいみたい。

https://marketplace.visualstudio.com/items?itemName=hdg.live-html-previewer

 

VS Code自体にはHTMLのプレビュー機能がない

HTMLを書きそのプレビューを確認したいという人にはうれしい拡張機能

    使い方
  • cont+q →w を押すとブラウザで動作を確認できる
  • 右クリック→Open in browser  でも可能

html ファイルでコマンド実行しないとエラーが出るので注意。 

エラー文

The current editor doesn't show a HTML document.

(

現在のエディタはHTMLドキュメントを表示しません。
 

)

 

f:id:shuzou555:20190329212322p:plain

自分の作業環境 Visual Studio Codechrome