会社の支給PCがWindows11で、開発環境の構築に苦戦しています。
今回はKintoneのJavaScript開発用にVSCodeのLive Serverの設定を試みていたのですが、プライベートのMacでは成功するのにWindows端末上のWSL2では動いてくれません。
試行錯誤の末ようやく動くようになりましたので、メモに残しておきます。
なお、今回はKintone開発のデバッグ環境構築を前提として話を進めます。
結論
mkcertのインストール先はwindows。pfxへの変換や証明書の登録など余計なことはしない。
手順
1:Chocolatey (Windows用のパッケージ管理システム)のインストール
まずは公式に従ってWindows版mkcertをインストールします。
https://github.com/FiloSottile/mkcert#installation
$ Set-ExecutionPolicy Bypass -Scope Process -Force; [System.Net.ServicePointManager]::SecurityProtocol = [System.Net.ServicePointManager]::SecurityProtocol -bor 3072; iex ((New-Object System.Net.WebClient).DownloadString('https://community.chocolatey.org/install.ps1'))
2:mkcertのインストール
choco
コマンドで一発。
$ choco install mkcert
3:インストール先ディレクトリに移動してキーを作成
よくある一般的な方法です。
$ mkcert -CAROOT
C:\Users\pc10h\AppData\Local\mkcert
$ cd C:\Users\pc10h\AppData\Local\mkcert
$ mkcert localhost 127.0.0.1 ::1
Created a new certificate valid for the following names 📜
- "localhost"
- "127.0.0.1"
- "::1"
The certificate is at "./localhost+2.pem" and the key at "./localhost+2-key.pem" ✅
It will expire on 15 January 2025
5:VSCodeに設定
settings.json
(略)
"liveServer.settings.https": {
"enable": true,
"cert": "\\Users\\pc10h\\AppData\\Local\\mkcert\\localhost+2.pem",
"key": "\\Users\\pc10h\\AppData\\Local\\mkcert\\localhost+2-key.pem"
},
(略)
以上終わり!