又见插件主进程调试

编写过cocos creator插件的小伙伴，相信都会遇到一个比较头疼的问题，如何调试自己编写的主进程代码。

简单的逻辑，你可以console.log完成调试工作，但是断点调试，是开发过程中的硬性需求，今天要介绍的就是在vscode里面编写调试代码。

如何使用

1. 下载CocosCreator插件：DebugMainProcess，并启用该插件。
2. 安装vscode插件：cc-plugin-debugger。
3. 使用vscode打开插件项目，launch.json中新建一个configuration

4. 运行configuration，在vscode中找到插件主进程的js代码，设置断点，当编辑器运行到该处时，vscode就会自动断下。

调试方案之一：Chrome Devtools

之前我也研究过，如何在Chrome中调试，其原理就是从命令行以调试模式(--inpect)启动cocos creator，然后在Chrome中监听端口，进行debug。

为什么Chrome可以调试？

这一切的背后，都是调试协议的功劳。

chrome devtools只是调试的前端，我们在里面的断点等操作，最终都是通过调试协议告诉了node，当node执行到断点时，同样也会通过调试协议告诉外部程序，感兴趣的可以了解下Chrome Devtools Protocol，简称CDP。

vscode的可以调试c++、js、java、c#等等语言，这么强大的调试功能背后，都离不开调试协议。

调试方案之二：Vscode

使用Chrome Devtools调试有许多不方便的地方：

• 必须命令行启动，并开启inspect选项。对于习惯dashboard打开项目，比较麻烦，而且需要输入断点选项，也很麻烦。
• Chrome里面需要设置监听的inspect选项的端口
• 编写和调试代码，需要频繁的切换

随着了解的深入，一个node程序，其实是存在一个调试server，用来和外部程序交互，而inspect选项，其实就是打开了这个debug protocol server。

换而言之，这个debug server只需要打开就能调试node程序，当我们启动一个node服务后，node允许我们通过:

process._debugProcess(process id)
复制代码

强制开启调试模式，这样我们就无须重新启动inspect，就能直接调试已经被node加载的代码。

开启调试server后，我们还需要将调试工具连接到调试server，vscode对node的调试其实支持的已经非常成熟了，在launch.json中新建一个如下配置:

{
  "type": "node",
  "request": "attach",
  "name": "CCMainProcessDebug",
  "port": 9229,
  "skipFiles": ["<node_internals>/**"]
}
复制代码

然后我们运行这个Configuration，vscode就会去连接本地端口为9229的debug server。

如果一切顺利，你就可以非常happy的debug了。

不足之处：

目前还没整明白如何支持sourcemap，所以目前还不能直接在ts代码中下断点，只能在js代码中下断点。

Creator查看主进程ID