問題:
VSCodeにてHTML/CSSのプレビューが以下のようになり、上手くできませんでした。
・拡張機能LiveServerを用いて開いた場合
コードを変えてもリアルタイムで反映されず、ブラウザを更新しても'Live Reload is not possible as body or head tag or defined tag is missing in HTML'とエラーメッセージが表示され、更新されない
・HTMLテキストをブラウザで直接開いた場合
ブラウザを更新しても更新されない
対処法:
VSCodeの設定を開き、Auto Saveの項目をafterDelayに変える
以上でいずれの場合も解決しました。ブラウザで直接開いた場合も更新されなかったため、HTMLテキストが変更されるたびに保存されていないのでは?と考え設定を確認したところ、案の定Auto Saveがデフォルトではoffになっていたので設定を変えてみたところ問題が解決しました。
ひとこと:
YouTubeのチュートリアル動画を見様見真似でいじっていたのですが、動画と同じように動作せず、この問題に対する対処法を説明している記事等も日本語・英語のいずれでも見かけなかったため、初の寄稿をする運びとなりました。記事がもっと読みやすくなるレイアウトや、検索に引っかかりやすい工夫等あると思うのですが、その辺は後々勉強ということで