Electron 打開開發者工具 devtools

轉載：http://newsn.com.cn/say/electron-devtools.html

   在electron開發的過程中，可以用代碼控制打開自帶chrome的devtools開發者工具，進而調試渲染教程頁面。

平時，我們利用chrome要調試網頁的時候，按F12（mac下面是shift+花+i）打開的開發者工具，就是這個devtools，或者可以稱之為“開發者模式”

1.打開devtools

mainWindow.webContents.openDevTools();

默認狀態下，開發者工具的位置是上一次工具打開的位置（左邊，右邊，下邊都有可能。取決於上一次的狀態，但不會是分離狀態，也沒有處於頂部的狀態）。

界面右側打開devtools

mainWindow.webContents.openDevTools({mode:'right'});

 

界面底部打開devtools

mainWindow.webContents.openDevTools({mode:'bottom'});

界面左側打開devtools

mainWindow.webContents.openDevTools({mode:'left'});

 

 

分離狀態打開devtools

mainWindow.webContents.openDevTools({mode:'detach'});