Live HTML

ワークスペース内のHTMLや静的ファイルをローカルサーバー経由でブラウザーに表示するVS Code拡張機能です。保存内容を自動反映し、ブラウザーキャッシュを無効にします。

使い方

1. VS Codeでプレビューしたいフォルダーを開きます。
2. HTMLファイルを開き、Ctrl+Alt+V（macOSはCmd+Option+V）を押します。 または、エクスプローラーでファイルを右クリックし、Live HTML: Open Previewを選びます。
3. ブラウザーで表示を確認します。HTMLや画像などを保存するとページが再読み込みされ、CSSの保存はスタイルだけに反映されます。
4. 終了するときはステータスバーのLive HTML: Runningをクリックするか、コマンドパレットからLive HTML: Stop Previewを実行します。

コマンドパレットからLive HTML: Open Previewを実行する場合は、対象ファイルをエディターでアクティブにしてください。プレビュー対象はローカルファイルで、開いているワークスペース内にある必要があります。

対応ファイル

HTML、CSS、JavaScript、JSON、SVGを含む画像、フォントなどの静的ファイルをプレビューできます。HTML以外のファイルを直接開いた場合も、保存時に自動で表示を更新します。サーバーはループバックアドレス（127.0.0.1）だけで待ち受け、ワークスペースの外側にあるファイルを配信しません。

開発

npm install
npm run compile
npm run lint

VS Codeでこのフォルダーを開き、F5を押すと拡張機能開発ホストで起動できます。