VSCodeで、Electronをデバックする

デバックツールの起動

ChromeブラウザのF12を押して起動するデバックツールを使えるようにします。
IDEのリモートデバック機能で、ステップ実行できるのは、メインプロセスのみとなります。
レンダリングプロセスをデバックするのは、Webページをデバックするのと同じ要領となります。

main.js

"use strict";

const electron = require("electron");
const app = electron.app;
const BrowserWindow = electron.BrowserWindow;
let mainWindow;

// 全てのウィンドウが閉じたら終了
app.on('window-all-closed', function() {
  if (process.platform != 'darwin') {
    app.quit();
  }
});
// Electronの初期化完了後に実行
app.on('ready', function() {
  // メイン画面の表示。ウィンドウの幅、高さを指定できる
  mainWindow = new BrowserWindow({
     width: 1024,
     height: 800,
     icon: __dirname + '/src/icons/comix.ico',
  });
  mainWindow.loadURL('file://' + __dirname + '/index.html');

  mainWindow.webContents.openDevTools();

  // ウィンドウが閉じられたらアプリも終了
  mainWindow.on('closed', function() {
    mainWindow = null;
  });
});

VSCodeからElectronをデバック実行する

メニューのデバックを選択して、ツールバーから歯車ボタンを押すとlaunch.jsが開かれます。
このファイルが、デバックの設定ファイルです。

launch.js

{
    // Use IntelliSense to learn about possible Node.js debug attributes.
    // Hover to view descriptions of existing attributes.
    // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
    "version": "0.2.0",
    "configurations": [
        {
            "name": "Debug Main Process",
            "type": "node",
            "stopOnEntry": false,
            "program": "${workspaceRoot}/main.js",
            "args": ["test.jpg"],
            "cwd": "${workspaceRoot}",
            "preLaunchTask": null,
            "runtimeArgs": [],
            "env": {
                "NODE_ENV": "development"
            },
            "linux": {
                "runtimeExecutable": "${env.HOME}/.nodebrew/node/v6.9.4/bin/electron"
            },
            "windows": {
                "runtimeExecutable": "${env.APPDATA}/npm/node_modules/electron-prebuilt/dist/electron.exe"
            },
            "console": "integratedTerminal",
            "sourceMaps": false,
            "outFiles": []
      }
    ]
}

Electronのライブラリをグローバルにインストールした場合の設定は、こんな感じで動くみたいです。
WindowsとLinuxの設定を共存させることもできます。