C# PWA対応のBlazor WebAssemblyをVSCodeでデバッグするには

VSCodeでPWA対応のBlazor WebAssemblyをデバッグしようとすると、ブレークポイントで止まらない場合があります。

PWA対応のBlazor WebAssemblyはデバッグできない？

2020年5月頃までは出来ませんでしたが、現在は出来るようになっています。
ただし、PWA対応にしているとPWAが原因でデバッグ出来ない場合があります。

PWA対応のプロジェクトか確認する方法

PWA対応かどうかはソリューション作成時のオプション指定次第です。
wwwroot/service-worker.jsが存在していれば、PWA対応です。

自己証明書を発行する

デバッグするとhttpsでデバッグが実行されます。
PWAアプリはhttpsのSSL接続で証明書が必須のため、自己証明書がないとservice-worker.jsが実行できず、エラーとなります。
service-worker.jsがエラーになるとデバッグも使用できなくなるため、以下のdotnetのコマンドで自己証明書を作成します。

dotnet dev-certs https --trust

.vscode/launch.json

デバッグ構成を.vscode/launch.jsonに記載します。
netcoreapp.のバージョンやプロジェクト名は適宜変更して下さい。

{
    // IntelliSense を使用して利用可能な属性を学べます。
    // 既存の属性の説明をホバーして表示します。
    // 詳細情報は次を確認してください: https://go.microsoft.com/fwlink/?linkid=830387
    "version": "0.2.0",
    "configurations": [
        {
            "name": "Launch and Debug Hosted Blazor WebAssembly App",
            "type": "blazorwasm",
            "request": "launch",
            "hosted": true,
            "program": "${workspaceFolder}/******/Server/bin/Debug/netcoreapp3.1/******.Server.dll",
            "cwd": "${workspaceFolder}/******/Server",
            "env": {
                "ASPNETCORE_ENVIRONMENT": "Development"
            }
        }
    ]
}