Visual Studio Code調試electron主進程
一·概述
此文原出自【水滴石】： http://www.easysb.cn
對於窗口中的javascript腳本，我們可以通過谷歌瀏覽器的很多插件來調試，比如DevTools等。但是對於Electron中的主程序，我們需要額外的工具和方法來進行調試。
對於Electron程序，可以通過以下的命令啟動程序，以方便外部調試工具通過V8調試協議來調試，其命令格式如下：
# elctron –debug=${port} path/to/app
# electron –debug-brk=${port} path/to/app
上面兩種啟動方式，都會使得Electron進程在指定的端口監聽。這樣，外部的調試工具就可以通過此端口，通過V8調試協議調試主程序。
二·VSCode 調試
使用Visual Studio Code可以調試Electron的主程序，這給我們開發調試帶來很大便捷，方法如下：
1) 在當前工程下，創建文件 .vscode/launch.json
2) 在該文件中輸入以下內容
{
“version”: “0.2.0”,
“configurations”: [
{
“name”: “Debug Main Process”,
“type”: “node”,
“request”: “launch”,
“cwd”: “${workspaceRoot}”,
// “runtimeExecutable”: “${workspaceRoot}/node_modules/.bin/electron.cmd”,
“runtimeExecutable”: “C:/Users/Administrator.SKY-20170407TCX/AppData/Local/Yarn/bin/electron.cmd”,
“program”: “${workspaceRoot}/main.js”
}]
}
注意以下兩個問題:
a) 路徑問題
如果electron是局部安裝的話，就執行局部環境路徑，例如”${workspaceRoot}/node_modules/.bin/electron.cmd”，如果是全局安裝的話，先執行yarn global bin查看全局的路徑，然后將electron的路徑填寫進去，比如我的全局路徑就是”C:/Users/Administrator.SKY-20170407TCX/AppData/Local/Yarn/bin/electron.cmd”。
b) 文件名
Linux和Windows的文件名會有所有不同，Windows的是electron.cmd，Linux的是electron，注意區分，最好的辦法就是去路徑下查看一下到底叫什么鬼！
3) 接下來，就可以點擊菜單Debug -> Start Debugging，也可以直接按快捷鍵F5，啟動程序。
4) 為了測試是否可以單步之類的操作，我們在主程序的第一行，打下斷點，然后按下F5啟動，主程序就斷在了第一行代碼中,而且還可以單步、查看變量以及調用棧等，相當方便，如下圖。
