温馨提示:在 ChatGPT 官网(www.chatgpt.com)使用 GPT-5.5、ChatGPT-Image-2 等模型时,需要 ChatGPT Plus 或更高等级的会员权限。如需购买账号或充值会员,请扫码添加我们客服咨询。
Cursor调试代码的核心流程:,1. **设置断点**:点击行号左侧添加红点,调试时在此暂停,2. **启动调试**:按F5或点击“运行与调试”面板,选择“Python调试器”等环境,3. **控制执行**:使用调试工具栏的“继续(F5)”、“单步跳过(F10)”、“单步进入(F11)”控制代码逐行执行,4. **检查变量**:暂停时左侧“变量”面板显示当前作用域所有变量值,鼠标悬停在代码变量上也显示,5. **监控表达式**:在“监视”面板添加表达式自动计算,6. **调用堆栈**:查看当前执行到哪个函数层级,点击堆栈行可跳转,7. **条件断点**:右键红点设置“表达式断点”(如x>5),满足条件才暂停,调试结束后按Shift+F5停止。本文目录导读:
- 为什么选择Cursor来调试代码
- 先搞清楚你的项目类型
- 断点怎么用
- 调试面板怎么看
- 调试时要按的快捷键
- 用AI辅助调试
- 常见调试场景
- 配置文件出了问题怎么办
- 多项目调试
- 远程调试
- 调试速度慢怎么办
- 调试时Crash了
- 团队协作时的调试
- 调试工具的使用技巧
- 总结一下
为什么选择Cursor来调试代码
很多人刚开始用Cursor的时候,以为它就是一个带AI的文本编辑器,其实它的调试功能也很强,你不需要再开一个单独的IDE,也不用在命令行里反复打日志,只要在Cursor里面,就能一步步看代码怎么跑。
我最早用VS Code的时候,调试要装插件,要配置launch.json,有时候搞半天还跑不起来,换了Cursor以后,发现它的调试设置跟VS Code差不多,但又多了AI的帮助,比如你不小心写错了断点,AI会直接告诉你哪里可能有问题。
调试这件事,说白了就是让代码停下来给你看,Cursor能做到这一点,而且做得比很多编辑器都顺手。
先搞清楚你的项目类型
调试之前,你要知道自己写的是什么代码,不同的语言,不同的框架,调试的方法不太一样。
1 前端项目(JavaScript, TypeScript, React等)
如果你写的是网页,那调试主要在浏览器里做,但Cursor可以帮你配置好调试环境,让你直接在编辑器里看到浏览器的控制台输出。
操作步骤:
- 打开你的前端项目文件夹
- 按
Ctrl+Shift+D(Mac上是Cmd+Shift+D)打开调试面板 - 点那个齿轮图标,选择“添加配置”
- 选“Chrome”或者“Edge”
- 系统会自动生成一个launch.json文件
这个配置文件大概长这样:
{
"version": "0.2.0",
"configurations": [
{
"type": "chrome",
"request": "launch",
"name": "启动Chrome并调试",
"url": "http://localhost:3000",
"webRoot": "${workspaceFolder}"
}
]
}
你只需要把url改成你自己项目的本地地址就行,比如React项目一般是http://localhost:3000,Vue项目可能是http://localhost:8080。
2 后端项目(Python, Node.js等)
后端调试更简单,不需要浏览器,你直接在代码里打断点,然后启动调试就行。
Python项目:
- 打开你的Python文件
- 在行号左边点一下,加一个红点(这叫断点)
- 按
F5(或者点菜单栏的“运行”->“开始调试”) - 选“Python File”
Node.js项目:
- 一样先加断点
- 按
F5 - 选“Node.js”
然后代码就会在断点那里停下来,你可以看变量值,可以一步步往下走。
3 其他语言
Cursor支持很多语言,Java、C++、Go这些都可以调试,原理都一样,就是加断点,启动调试,看变量。
不过要注意一点:有些语言需要先装好对应的调试器,比如Java要装Java Extension Pack,C++要装C/C++插件,这些在Cursor的插件市场里都能找到。
断点怎么用
断点是调试的核心,不打断点,代码就跑到底了,你看不到中间发生了什么。
1 普通断点
最简单的用法,在行号左边点一下,出现一个红点,运行到这一行的时候,代码就停了。
2 条件断点
有时候你不想每次都停,比如一个循环要跑100次,你只想知道第50次的时候变量是什么,这时候可以用条件断点。
右键点击红点,选“编辑断点”,输入条件:
i === 50—— 第50次的时候停user.name === "张三"—— 用户名字是张三的时候停
这样代码就不会在每次循环都停了,省时间。
3 日志断点
有时候你不想停下来,只是想看看某个变量值,这时候可以用日志断点。
右键点击行号,选“添加日志断点”,输入你要看的变量名,比如变量x的值是:{x},运行时不会停,但控制台会打印这句话。
这个方法比写console.log强多了,因为你不用改代码,也不用删打印语句。
调试面板怎么看
按Ctrl+Shift+D打开调试面板,你会看到几个区域:
1 变量区
这里显示当前作用域里的所有变量,有局部变量、全局变量、闭包变量等。
你可以展开对象看里面的属性,也可以鼠标悬停在变量上看值,比用print方便多了。
2 监视区
有时候变量太多,你只关心某几个,可以在监视区输入变量名,比如userList.length,调试的时候它会一直显示这个值的变化。
3 调用栈
这个告诉你代码是怎么跑到这一行的,比如A函数调了B函数,B函数又调了C函数,调用栈会显示这个链条。
如果你发现代码跑到了一个奇怪的地方,看看调用栈就知道是怎么来的了。
4 断点区
这里列出你所有的断点,你可以一次性启用或禁用所有断点,也可以删除某一个。
调试时要按的快捷键
记住这几个快捷键,调试效率高很多:
F5:开始调试F10:单步跳过(不进入函数内部)F11:单步进入(进入函数内部看细节)Shift+F11:单步跳出(跳出当前函数)Shift+F5:停止调试Ctrl+Shift+F5:重新开始调试
说一个经验:当你不知道一个函数里面干了什么的时候,用F11进去看看,如果你只是想知道这一行代码跑完了结果对不对,用F10跳过。
用AI辅助调试
这是Cursor跟其他编辑器最大的区别,在调试的时候,AI可以帮你分析问题。
1 停在断点处问AI
代码停在断点的时候,你可以在AI对话窗口里问:
- “这个变量的值不对,为什么?”
- “这里应该是一个数组,但现在是undefined,哪里出问题了?”
- “这个函数的预期输出是什么?”
AI会结合断点处的上下文给你解释,有时候比自己看代码快很多。
2 选中错误信息问AI
如果控制台报了红色的错误,选中那行错误信息,按Ctrl+L(Mac上是Cmd+L),AI会帮你解释这个错误是什么意思,以及怎么改。
3 让AI帮你检查逻辑
你可以在代码里选几行,问AI“这段代码的逻辑有没有问题”,它会给你指出潜在的问题,比如忘记处理边界情况,或者变量名写错了。
常见调试场景
1 页面白屏
前端项目最常见的错误,页面打开什么都没有。
调试方法:
- 按
F12打开浏览器开发者工具 - 看控制台有没有红色错误
- 在
index.js或App.js的第一行加断点 - 按
F5重新调试 - 看页面是不是加载了正确的组件
很多白屏是因为某个组件报错导致整个页面崩溃了,用断点找到那个出问题的组件就好。
2 API请求失败
前后端联调的时候,接口经常报500或者404。
调试方法:
- 在调用API的地方加断点
- 看参数是不是对的(url、method、body)
- 看返回的数据结构是不是跟预期一样
- 如果返回的是401,说明权限有问题
可以在监视区加上response.status,看状态码是不是200。
3 数据不对
页面显示的数据跟数据库里的不一样。
调试方法:
- 在数据处理的函数里加断点
- 一步步看数据是怎么变的
- 有时候是filter或者map写错了,用F11进去看每一步
4 死循环
代码一直跑,停不下来。
调试方法:
- 关掉正在运行的程序
- 在循环条件判断的地方加断点
- 看条件变量是不是一直不变
- 比如
while(i > 0)里面忘了写i--
配置文件出了问题怎么办
有时候launch.json配置不对,调试启动不起来。
1 常见的配置错误
- 路径不对:
webRoot指向了错误的文件夹 - 端口不对:
url里的端口号跟实际启动的不一样 - 没有装对应的调试器:比如调试Python没装Python插件
2 怎么修正
- 看错误的提示,一般会说“找不到文件”或者“连接不上”
- 检查你的项目是在哪个目录下启动的
- 确认你的应用在终端里能正常运行
也可以用AI帮忙,把launch.json的内容复制给AI,说“我这个配置启动不了”,AI会帮你检查哪里写错了。
多项目调试
有时候你要同时调试前端和后端,比如前端调API的时候,后端也在跑。
办法是这样的:
- 先启动后端的调试
- 再启动前端的调试
- 前端在调接口的时候,后端的断点会触发
这样可以看整个请求从发出去到返回的全过程,前端传给后端的参数对不对,后端返回的数据对不对,一眼就能看到。
在调试面板的顶部,你可以切换当前调试的是哪个项目。
远程调试
有时候代码不在本地,比如在服务器上或者容器里,Cursor也支持远程调试。
- 装“Remote Development”插件
- 连接到远程服务器
- 在远程服务器上打开项目
- 然后在远程的环境里调试
原理跟本地一样,只是代码运行在别的地方。
调试速度慢怎么办
有时候每一步都要等很久,特别是处理大量数据的时候。
几个办法:
- 用条件断点,只在关键的地方停
- 用日志断点,不停下来也能看到值
- 把数据量缩小,比如只处理10条数据而不是10000条
- 实在不行,用
console.log快速验证
调试时Crash了
代码在调试的时候崩溃了,看不到任何信息。
- 看调试控制台有没有错误
- 看调用栈停在哪里
- 看是不是内存溢出了
- 检查是不是递归调用太深
可以加一个try...catch,在catch里面打断点,这样即使报错了,也能知道为什么。
团队协作时的调试
多人一起开发一个项目,调试时要注意:
- 不要提交launch.json里写死的本地路径
- 用
${workspaceFolder}这种变量代替绝对路径 - 把常用的调试配置分享给团队
可以在.gitignore里把.vscode文件夹排除掉,或者只提交launch.json,不提交settings.json。
调试工具的使用技巧
- 鼠标悬停在变量上就能看到值,不用每次都去变量区找
- 调试面板可以拖到右边或者下面,看你习惯
- 可以用
Ctrl+Y(Mac上是Cmd+Y)重新执行上一次的调试 - 在调试过程中可以修改代码,保存后按
Ctrl+Shift+F5重新跑
总结一下
调试代码这件事,一开始会觉得麻烦,但用习惯了,就会发现比写日志快很多,Cursor的调试功能跟VS Code几乎一样,但又多了AI的辅助。
不需要所有功能都记住,先学会加断点、按F5、看变量,这三步解决大部分问题,以后再慢慢学条件断点、日志断点、调用栈这些高级功能。
如果你在配置或使用过程中遇到问题,扫描页底二维码可以找到我们,不管是你项目类型选不对,还是launch.json配置搞不定,我们都会帮你看看。
温馨提示:在 ChatGPT 官网(www.chatgpt.com)使用 GPT-5.5、ChatGPT-Image-2 等模型时,需要 ChatGPT Plus 或更高等级的会员权限。如需购买账号或充值会员,请扫码添加我们客服咨询。


网友评论