码迷,mamicode.com
首页 > 系统相关 > 详细

Visual Studio Code调试electron主进程

时间:2017-12-06 22:07:22      阅读:255      评论:0      收藏:0      [点我收藏+]

标签:很多   ima   www.   modules   http   开发调试   config   方式   启动方式   

Visual Studio Code调试electron主进程

作者: jekkay 分类: electron 发布时间: 2017-06-11 14:56 

 

一·概述

      此文原出自【水滴石】: 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启动,主程序就断在了第一行代码中,而且还可以单步、查看变量以及调用栈等,相当方便,如下图。
技术分享图片

 

Visual Studio Code调试electron主进程

标签:很多   ima   www.   modules   http   开发调试   config   方式   启动方式   

原文地址:http://www.cnblogs.com/wangjian8888/p/7994548.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!