Windows10/VSCode/WSL2/Docker/Hugoでblogを書いています
etc
Published: 2021-10-27

bitter*smooth と言う音楽レビューサイトを作っています。

この環境、サーバーサイドはNetlify/Hugo、ローカルではVSCodeでMarkdownを書く、と言う環境で構築しているのですが、あれ?そもそもVSCodeを使うなら、WSL2/DockerDesktop/Remote-Containersでローカル確認もすれば良いんじゃない?と思って、やったらサクッと出来ました!


wsl --install
wsl --set-default-version 2
wsl --install -d Ubuntu

まぁ、ここら辺までは、Windows10で開発している人ならフツーに出来るんでないでしょうか?

で、プロジェクトのトップで、 .devcontainer ディレクトリを作り、その配下に、 Dockerfile devcontainer.json の2つのファイルを作ります。

  • .devcontainer/Dockerfile 1
FROM klakegg/hugo:0.88.0-alpine
RUN apk update && apk --no-cache add git
  • .devcontainer/devcontainer.json 2
{
	"name": "bittersmooth",
	"build": {
		"dockerfile": "Dockerfile",
	},
	"extensions": [
		"mhutchie.git-graph"
	]
}

簡単に Hugo の環境が手に入るのですが、コレひとつだけ落とし穴があって、 hugo server -w でライブローディングが効かないんですね。 まぁ、VSCodeだとMarkdownのプレビューも簡単ですし、最終確認だけ hugo server -w で確認すれば良いのかな?と言う感じでやっています。


  1. alpineベースのイメージだと、Gitすら入っていないので apk --no-cache add git が、必要なのです。 ↩︎

  2. 拡張機能、 Git Graph 位は欲しいですよね…。 ↩︎