Electron 打开开发者工具 devtools

Electron 打开开发者工具 devtools

在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'});

相关推荐
周星星日记16 小时前
vue中hash模式和history模式的区别
前端·面试
Light6016 小时前
Vue 高阶优化术:v-bind 与 v-on 的实战妙用与思维跃迁
前端·低代码·vue3·v-bind·组件封装·v-on·ai辅助开发
周星星日记16 小时前
5.为什么vue中使用query可以保留参数
前端·vue.js
lebornjose16 小时前
javascript - webgl中绑定(bind)缓冲区的逻辑是什么?
前端·webgl
瘦的可以下饭了16 小时前
Day05- CSS 标准流、浮动、Flex布局
前端
前端无涯16 小时前
React中setState后获取更新后值的完整解决方案
前端·react.js
西愚wo16 小时前
前端开发者必备:在浏览器控制台批量提取HTML表单字段名(Label)
前端
小鸡吃米…17 小时前
Python - 类属性
java·前端·python
前端不太难17 小时前
Navigation State 驱动的页面调试方法论
开发语言·前端·react.js
用户479492835691517 小时前
你每天都在用的 JSON.stringify ,V8 给它开了“加速通道”
前端·chrome·后端