前回の記事、SAFE Stackにログイン画面を追加 -- JWT(Json Web Token)による認証／認定の実装で、このシリーズは完了と書いたのですが、SAFE StackがVSCodeでデバッグ出来るようになったので、記事追加します。
SAFEテンプレートはこれまで、Elmishのデバッグに Redux Dev ToolというChrome拡張機能で対応していたのですが、メッセージの追跡くらいしか出来ませんでした。
また、Server側のデバッグには、私の場合はプロセスにアタッチして何とかやっていたのですが、今回のテンプレートのアップデートで普通にデバッグ実行できるようになりました。 ばんざーい
新しく作ったテンプレートのプロジェクトから、
- build.fsx
- .vscodeフォルダ一式
- src\Client\webpack.config.json
をコピーして、webpack.config.jsonのカスタマイズしている部分（/publicルートの追加、Thoth.Elmish.Toastのcss埋め込み設定）を加えて、デバッグメニューから "Debug SAFE App"を選択して、いざ、実行！
あれ.... appsettings.jsonが読み込めてない...
Stack Overflow のここが参考になりました。
というわけで、.vscode\launch.jsonを若干修正して、今度こそ F5キーをpress!
無事、起動しました。 わーい
Client側のブレークポイントの動作が微妙に怪しい感じですが、source mapがまだこなれていないせいでしょうか...？
でもでも、かなーり、いい感じです。
うれしくて、番外編記事を追加しちゃったくらいです。
今回はこれだけなので、前回のリポジトリ、GitHubのこちらにマージしちゃいました。
ご参考になれば幸いです。
(今回の記事は内容薄いのでマロさんのサービスショットを)