在vscode中调试CocosCreator插件主进程

简介: 在vscode中调试CocosCreator插件主进程

又见插件主进程调试

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

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

网络异常,图片无法展示
|

如何使用

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

网络异常,图片无法展示
|

  1. 运行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

网络异常,图片无法展示
|



目录
相关文章
|
6天前
|
人工智能 小程序 程序员
【视频测评 DEMO 参考】VSCode 神级 AI 插件通义灵码:完全免费+实战教程+微信贪吃蛇小程序
VSCode 神级 AI 插件通义灵码:完全免费+实战教程+微信贪吃蛇小程序
153 7
|
8天前
|
机器学习/深度学习 人工智能 自然语言处理
|
3月前
|
前端开发 数据处理 Android开发
Flutter前端开发中的调试技巧与工具使用方法,涵盖调试的重要性、基本技巧如打印日志与断点调试、常用调试工具如Android Studio/VS Code调试器和Flutter Inspector的介绍
本文深入探讨了Flutter前端开发中的调试技巧与工具使用方法,涵盖调试的重要性、基本技巧如打印日志与断点调试、常用调试工具如Android Studio/VS Code调试器和Flutter Inspector的介绍,以及具体操作步骤、常见问题解决、高级调试技巧、团队协作中的调试应用和未来发展趋势,旨在帮助开发者提高调试效率,提升应用质量。
89 8
|
3月前
|
自然语言处理 API C++
阿里通义推出SmartVscode插件,自然语言控制VS Code,轻松开发应用,核心技术开源!
SmartVscode插件深度解析:自然语言控制VS Code的革命性工具及其开源框架App-Controller
|
3月前
|
开发工具 C++ git
利用VS Code提升开发效率的五大插件推荐
本文推荐了五款能显著提升开发效率的VS Code插件:ESLint用于代码质量和风格检查;Prettier自动格式化代码;GitLens增强Git功能;Live Server提供前端实时预览;Docker支持容器管理。
|
4月前
|
自然语言处理 JavaScript 开发者
通义灵码插件:VSCode 的智能编程助手
通义灵码插件:VSCode 的智能编程助手
1847 3
|
4月前
|
前端开发 JavaScript 编译器
2024最新VSCode实用插件推荐,开发效率遥遥领先!超全面,快收藏~
【10月更文挑战第11天】2024最新VSCode实用插件推荐,开发效率遥遥领先!超全面,快收藏~
1117 0
2024最新VSCode实用插件推荐,开发效率遥遥领先!超全面,快收藏~
|
5月前
|
开发框架 .NET C#
VSCode开发.net项目时调试无效
【9月更文挑战第22天】在使用 VSCode 开发 .NET 项目时遇到调试问题,可从项目配置、调试配置、调试器安装、运行环境、日志和错误信息等方面排查。确认项目类型及文件配置,检查 `launch.json` 文件及配置项,确保调试器扩展已安装并启用,验证 .NET 运行时版本和环境变量,查看 VSCode 输出窗口和项目日志文件,检查权限及代码错误。若问题仍未解决,可查阅官方文档或社区论坛。
135 4
|
5月前
|
人工智能 C++ 开发者
verilog vscode 与AI 插件
【9月更文挑战第11天】在Verilog开发中,使用Visual Studio Code(VS Code)结合AI插件能显著提升效率。VS Code提供强大的编辑功能,如语法高亮、自动补全和代码格式化;便捷的调试功能,支持多种调试器;以及丰富的插件生态。AI插件则可自动生成代码、优化现有代码、检测并修复错误,还能自动生成文档。常用插件包括Verilog AI Assistant和Verilog Language Server,可根据需求选择合适的工具组合,提高开发效率和代码质量。
390 2
|
6月前
|
前端开发 Go
vscode10大常用插件
本文介绍了前端开发中常用的工具及VSCode必备插件。推荐使用VSCode作为入门工具,并介绍了WebStorm和HBuilder等其他选项。VSCode插件包括:Open-In-Browser、live-server、Beautify、Code Runner、Image Preview、Path Intellisense、Turbo Console Log、css-auto-prefix、Bracket Pair Colorizer 和 Auto Rename Tag,这些插件能够显著提升开发效率和代码质量。此外,还提供了录制Gif图的工具GifCam。
197 5

热门文章

最新文章