求人不如求己,今天给萌新带来一篇利用 Chrome 调试 Cocos Creator 游戏的教程,学会调试之后你就可以自己解决很多问题啦。
Windows:F12
或 Ctrl+Shift+I
Mac:Cmd+Opt+I
有些网页可能屏蔽了快捷键,那么右上角手动点
Elements:
用来查看界面元素,前端开发经常用到,但对于调试游戏来说,基本不会用到
Console:
控制台输出,当然也可以输入
Ctrl+L
清空控制台
Sources:
网页(游戏)的资源文件
Ctrl+P
可以搜索文件
这里要确保打开了Source Map,这样才能看到原始的代码
Network:
数据的请求信息
联网的游戏经常用到,比如查看一些 http 请求
Performance:
运行的实时表现
按两下Ctrl+E
来得到一段时间内游戏运行实时表现,可以分析各个模块耗时多少,针对性地提高游戏性能
Ctrl+P
搜索并打开 Game.ts,在gameOver
函数下面一行的行号上单击设置一个断点,当游戏运行到这里时就会停下来
此时你就拥有了上帝之手,想干嘛干嘛
利用控制台查看变量
单步调试
这几个按钮依次代表
至于“道理我都懂,但是我要在哪里下断点”这种问题,就要靠天赋了。
debugger
就会自动停止运行 console.trace()
会输出函数调用堆栈 console.table()
会把一个对象按表格形式输出 console.time()
和 console.timeEnd()
得到一段代码的执行时间 联系客服