electron/docs/tutorial/debugging-main-process-vscode.md
Gordon MacPherson 9b4fef3c38 Fixed vscode debugging code
Fixes app.getPath("userData") pointing to the wrong folder. (electron in %appdata%)

The old debugger essentially runs:
.\node_modules\.bin\electron main.js

Which makes userData incorrect and various other things wrong related to app launch.

The new version correctly executes:
.\node_modules\.bin\electron .

Which means when you call app.getPath("userData") it will return the correct folder name, and not 'electron', which is what my app was doing even though the folder was named properly.
2017-05-20 14:56:26 +01:00

1.1 KiB

Debugging the Main Process in VSCode

1. Open an Electron project in VSCode.

$ git clone git@github.com:electron/electron-quick-start.git
$ code electron-quick-start

2. Add a file .vscode/launch.json with the following configuration:

{
  "version": "0.2.0",
  "configurations": [
    {
      "name": "Debug Main Process",
      "type": "node",
      "request": "launch",
      "cwd": "${workspaceRoot}",
      "runtimeExecutable": "${workspaceRoot}/node_modules/.bin/electron",
      "windows": {
        "runtimeExecutable": "${workspaceRoot}/node_modules/.bin/electron.cmd"
      },
      "args" : ["."]
    }
  ]
}

Note: For Windows, use "${workspaceRoot}/node_modules/.bin/electron.cmd" for runtimeExecutable.

3. Debugging

Set some breakpoints in main.js, and start debugging in the Debug View. You should be able to hit the breakpoints.

Here is a pre-configured project that you can download and directly debug in VSCode: https://github.com/octref/vscode-electron-debug/tree/master/electron-quick-start