はじめに #
いろいろ調べたが、Windows 自身の仕様によってホットリロードができないらしいです。
私の Mac Mini では、同じ Docker の設定ファイルで構築した仮想環境にコンテンツのリアルタイム更新ができます。
解決策として、WSL (Windows Subsystem for Linux) を使う必要があります。
WSL のインストール #
WSL のインストールは1つのコマンドでできます。
管理者モードで PowerSHell を開き、以下のコマンドを実行します。
wsl --install私の場合、WSL が壊れたというエラーが出たが、エラーメッセージに従え、最後に wsl --install をもう一度実行したらインストール出来ました。
VSCode と WSL の統合 #
プラグインのインストール #
私はメインに VSCode で Hugo の構築を行っています。
ここで必要なプラグインをインストールします。
WSL ファイルシステムにアクセス #
Windows のディレクトリでもそのままターミナルで wsl コマンドを実行し、WSL 環境にアクセスできますが、処理速度が大幅に低下するとマイクロソフトさんのドキュメントに掲載しています。
ここでは WSL のファイルシステムにソースコードを収納することを強くおすすめします。
Windows デスクトップのファイルシステムでも WSL ファイルシステムにアクセスことも可能です。
エクスプローラーのアドレスバーで以下のアドレスを入力します。
\\wsl$
このようにアクセスことができます。
ユーザーディレクトリは以下のアドレスにあります。
\Ubuntu\home\<user>仮想開発環境の構築 #
ソースコードディレクトリに移動します。
WSL 環境で VSCode を開けます。
code .左下側に WSL Linux ディストリビューションに接続されていることを確認します。
もし接続されていない場合、F1 または ctrl+shift+p を押して
WSL: Reopen Folder in WSL を実行します。
WSL 環境に入ったら、F1 または ctrl+shift+p を押して
Dev Containers: Open Folder in Container... を実行します。
VSCode のターミナルで Hugo サーバーを実行します。
hugo serverPORTS または右下で現れたポップアップでサイトにアクセスし、動作を確認します。
これで、WSL の Docker 仮想環境の構築が完成し、ホットリロードができるはずです。