# 9.2.在 node-inspector 中調試主進程 [`node-inspector`][node-inspector] 提供了一個熟悉的開發者工具 GUI，可以用在 Chrome 中調試 Electron 主進程，然而，因為 `node-inspector` 依賴于一些原生 Node 模塊，它們必須以你希望調試的版本的 Electron 為目標重新編譯。你可以自己重新編譯 `node-inspector` 的依賴關系，或者讓 [`electron-inspector`][electron-inspector] 為你完成，這個文檔覆蓋這兩種途徑。 **注意**： 在編寫的時候，最新版的 `node-inspector` （0.12.8）如果沒有修復其中一個依賴關項時，不能以 Electron 1.3.0 或者更新的版本為目標重新編譯。如果你使用 `electron-inspector` ，它會為你考慮這點。 ## 使用 `electron-inspector` 來調試 ### 1. 安裝 [node-gyp required tools][node-gyp-required-tools] ### 2. 如果你還沒有安裝過，先安裝 [`electron-rebuild`][electron-rebuild] ```shell npm install electron-rebuild --save-dev ``` ### 3. 安裝 [`electron-inspector`][electron-inspector] ```shell npm install electron-inspector --save-dev ``` ### 4. 啟動 Electron 使用 `--debug` 開關運行 Electron： ```shell electron --debug=5858 your/app ``` 或者，要暫停 JavaScript 的第一行的執行： ```shell electron --debug-brk=5858 your/app ``` ### 5. 啟動 electron-inspector macOS / Linux: ```shell node_modules/.bin/electron-inspector ``` Windows: ```shell node_modules\\.bin\\electron-inspector ``` `electron-inspector` 在第一次運行時需要重建 `node-inspector` 依賴關系，包括任何時候你修改了你的 Electron 版本時。重建過程可能需要一個網絡連接來下載 Node headers 和 庫，可能花費一些時間。 ### 6. 載入調試工具 UI 在 Chrome 瀏覽器中打開 http://127.0.0.1:8080/debug?ws=127.0.0.1:8080&port=5858 。如果使用 `--debug-brk` 啟動，你可能需要點擊暫停來強制更新 UI。 ## 使用 `node-inspector` 來調試 ### 1. 安裝 [node-gyp required tools][node-gyp-required-tools] ### 2. 安裝 [`node-inspector`][node-inspector] ```bash $ npm install node-inspector ``` ### 3. 安裝 [`node-pre-gyp`][node-pre-gyp] ```bash $ npm install node-pre-gyp ``` ### 4. 為 Electron 重新編譯 `node-inspector` `v8` 模塊 **注意：** 更新目標參數為你的 Electron 版本號 ```bash $ node_modules/.bin/node-pre-gyp --target=1.2.5 --runtime=electron --fallback-to-build --directory node_modules/v8-debug/ --dist-url=https://atom.io/download/atom-shell reinstall $ node_modules/.bin/node-pre-gyp --target=1.2.5 --runtime=electron --fallback-to-build --directory node_modules/v8-profiler/ --dist-url=https://atom.io/download/atom-shell reinstall ``` 也可以查看 [如何安裝原生模塊][how-to-install-native-modules]。 ### 5. 為 Electron 啟用調試模式 也可以通過一個調試開關啟動 Electron，如下： ```bash $ electron --debug=5858 your/app ``` 或者，在第一行暫停你的腳本： ```bash $ electron --debug-brk=5858 your/app ``` ### 6. 使用 Electron 啟動 [`node-inspector`][node-inspector] 服務 ```bash $ ELECTRON_RUN_AS_NODE=true path/to/electron.exe node_modules/node-inspector/bin/inspector.js ``` ### 7. 載入調試工具 UI 在 Chrome 瀏覽器中打開 http://127.0.0.1:8080/debug?ws=127.0.0.1:8080&port=5858 。如果使用 `--debug-brk` 啟動，必須點擊暫停查看入口行。 * [electron-inspector]: https://github.com/enlight/electron-inspector * [electron-rebuild]: https://github.com/electron/electron-rebuild * [node-inspector]: https://github.com/node-inspector/node-inspector * [node-pre-gyp]: https://github.com/mapbox/node-pre-gyp * [node-gyp-required-tools]: https://github.com/nodejs/node-gyp#installation * [how-to-install-native-modules]: 【使用Node 原生模塊】