使用 DevTools 除錯
僅 SDK 風味
DevTools 僅在 SDK 風味 中提供。建議使用 SDK 風味來開發和測試您的應用程式。並在製作時使用其他風味。
開啟開發人員工具
DevTools 可以使用鍵盤捷徑 F12（Windows 和 Linux）或 ⌘+⌥+i（Mac）開啟。
或者，您可以使用 NW.js API win.showDevTools() 以程式方式開啟 DevTools。
Node.js 模組除錯
NW.js 預設以 獨立內容模式 執行。若要除錯 Node.js 模組，您可以按一下應用程式並選擇「檢查背景頁面」。在除錯器中逐步執行 Node.js 模組時，背景頁面的 DevTools 會自動聚焦並在特定陳述中停止。
如果您的應用程式在 混合內容模式 下執行，則 Node.js 模組可以在同一個 DevTools 視窗中直接除錯。請參閱 NW.js 中的 JavaScript 內容 以了解差異。
遠端除錯
您可以使用 --remote-debugging-port=port 命令列選項來指定 DevTools 應監聽的埠。例如，透過執行 nw --remote-debugging-port=9222，您可以在瀏覽器中開啟 http://localhost:9222/ 以遠端拜訪除錯器。
使用 DevTools 擴充功能
Devtools 擴充功能獲得完全支援，包括 ReactJS、Vue.js 等擴充功能。若要使用它，請將權限「chrome-extension://*」新增至 devtools 擴充功能的 manifest.json，並在 nw 啟動時載入它，方法為 --load-extension=path/to/extension。在您從 Chrome 網路商店安裝 devtools 擴充功能後，可以從 Chrome 瀏覽器的擴充功能資料夾複製 devtools 擴充功能的檔案。
React 範例
- https://s3-us-west-2.amazonaws.com/nwjs/sample/react-app.zip
- https://s3-us-west-2.amazonaws.com/nwjs/sample/react-devtools.zip
解壓縮它們，下載 SDK 組建並執行它：nw.exe --load-extension=path/to/devtools path/to/app/folder
該應用程式是一個簡單的 react 應用程式，已新增「package.json」。devtools 檔案來自 Chrome 瀏覽器的擴充功能資料夾，其中包含從 Chrome 網路商店安裝的官方 react devtools 擴充功能。只有 manifest 檔案經過修改，以新增權限：「chrome-extension://*」。
Vue 範例
npm install --save-dev nw-vue-devtools-prebuilt- 將此新增至您的
package.json
"chromium-args": "--load-extension='./node_modules/nw-vue-devtools-prebuilt/extension'",
- 您的應用程式中必須使用 Vue.js，且不能縮小（使用
vue.js，而非vue.min.js）。
這將自動從 Chrome 網路商店下載最新的 Vue-DevTools，解壓縮並修改它，以在 NW.js 中執行。
如果您正在使用 nwjs-builder-phoenix，請在 package.json build.strippedProperties 陣列中新增 "chromium-args"。