釈然としないelectron-vueでのmainプロセスのデバッグ

electron-vueについて

諸々入ったセットである。今回はこれにさらにtypescriptを突っ込んで開発をしている。
npm run devで開発時には以下のコードによりwebpack build in serverが立ち上がり開発が可能である。

VSCodeでのnodeデバッグ

一方でVSCode上でのでバッグは以下のようにlaunch.jsonを書くことで可能だと言われている。

{
  // Use IntelliSense to learn about possible attributes.
  // Hover to view descriptions of existing attributes.
  // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
  "version": "0.2.0",
  "configurations": [
    {
      "type": "node",
      "request": "launch",
      "name": "Electron: Main",
      "protocol": "inspector",
      "runtimeExecutable": "${workspaceFolder}/node_modules/.bin/electron",
      "runtimeArgs": [
        "--enable-logging",
        "--remote-debugging-port=9223",
        "."
      ],
      "outputCapture": "std",
      "sourceMaps": true,
      "preLaunchTask": "build"
    }
  }
}

しかしこれはあくまで、バンドルされたstatic fileをelectronから呼び出すだけなので、上記で devでビルドしたときのファイルが呼び出されない？模様。

そこで

1. 以下をコメントアウトする。

2. Run Debug

上記 launch.jsonを用意して > を実行

3. うまくいく

という感じである。

理由

VSCodeからうまくWebPackのビルドインサーバを呼び出したり、main/rendererプロセスのビルドができなかった・・・とりあえずこれでMain Processのデバッグはできたのでよしとする。