用Visual Studio Code调试代码

Visual Studio Code 对调试各种类型的应用程序有丰富的支持。VS Code 内置支持 JavaScript、TypeScript 和 Node.js调试。Visual Studio Marketplace 提供了多种调试扩展，为 VS Code 增加了对其他语言和运行时的调试支持。

本文介绍了VS Code的调试功能以及如何开始在VS Code中调试。你还会学习如何在VS Code中使用Copilot，加快调试配置的设置和调试会话的启动。

以下视频展示了如何开始在VS Code中调试。

调试器用户界面

下图展示了调试器用户界面的主要组件：

1. 运行和调试视图：显示所有与运行、调试和管理调试配置设置相关的信息。
2. 调试工具栏：有按钮用于最常见的调试作。
3. 调试控制台：允许查看并与调试器中运行的代码输出交互。
4. 调试侧边栏：在调试会话中，允许你与调用栈、断点、变量和监控变量交互。
5. 运行菜单：包含最常见的运行和调试命令。

在你开始调试之前

1. 在Visual Studio Marketplace安装一个针对你语言或运行时的调试扩展。

   VS Code 内置支持 JavaScript、TypeScript 和 Node.js调试。

2. 为你的项目定义调试配置。

   对于简单的应用程序，VS Code 尝试运行和调试当前活跃的文件。对于更复杂的应用或调试场景，你需要创建一个launch.json文件以指定调试器配置。获取更多关于创建调试配置的信息。

   提示

   VS Code 中的 Copilot 可以帮助生成launch.json帮你申请。更多信息请参见使用 Copilot 生成调试配置。

3. 在代码中设置断点。

   断点是你可以在代码行上设置的一个标记，用来告诉调试器在到达该行时暂停执行。你可以在编辑器里点击行号旁边的“排水沟”来设置断点。

   有关断点的更多信息，请参见“使用断点”。

开始调试会话

要在 VS Code 中启动调试会话，请执行以下步骤：

1. 打开包含你想调试代码的文件。

2. 用 F5 键开始调试会话，或在运行和调试视图中选择运行和调试 （workbench.view.debug).

   

   对于更复杂的调试场景，比如附加到正在运行的进程，你需要创建一个launch.json文件以指定调试器配置。获取更多关于调试配置的信息。

3. 从可用的调试器列表中选择你想使用的调试器。

   VS Code 尝试运行和调试当前活动文件。对于Node.js，VS Code 检查开始在package.json文件以确定应用的入口点。

4. 当调试会话开始时，会显示调试控制台面板并显示调试输出，状态栏颜色变更（默认颜色主题为橙色）。

   

5. 状态栏中的调试状态显示当前的调试配置。选择调试状态以更改当前启动配置，无需打开运行和调试视图即可开始调试。

   

调试动作

调试会话开始后，调试工具栏会出现在窗口顶部。工具栏包含控制调试会话流程的作，如逐步推进代码、暂停执行和停止调试会话。

下表描述了调试工具栏中可用的作：

如果你的调试会话涉及多个目标（例如客户端和服务器），调试工具栏会显示会话列表，并允许你在它们之间切换。

断点

断点是一个特殊的标记，会在特定点暂停代码执行，这样你可以检查该点的应用状态。VS Code 支持多种类型的断点。

设置断点

要设置或取消断点，请点击编辑器边距或在当前行上按F9键。

• 编辑页边的断点通常以红色填充圆圈表示。
• 禁用的断点会有一个填满的灰色圆圈。
• 调试会话开始时，无法被调试器识别的断点会变成灰色空心圆圈。如果在没有实时编辑支持的调试会话运行时编辑源代码，也可能发生同样的情况。

可选地，通过启用设置，可以在编辑器的概览尺中显示断点

如需更好地控制断点，可以使用运行和调试视图中的断点部分。本节列出了代码中的所有断点，并提供了额外的作来管理它们。

断点类型

条件断点

一个强大的 VS Code 调试功能是能够根据表达式、命中次数或两者结合设置条件。

• 表达式条件：当表达式值为 时，断点即被击中确实如此.
• 命中计数：命中计数控制断点需要被击中多少次才能中断执行。是否尊重命中计数以及表达式的具体语法，在不同调试器扩展中可能有所不同。
• 等待断点：当触发另一个断点被触发时，断点被激活。

添加条件断点：

1. 创建一个条件断点

   • 右键点击编辑器边缘，选择添加条件断点。
   • 在命令面板中使用添加条件断点命令（⇧⌘P（Windows，Linux Ctrl+Shift+P））。

2. 选择你想设置的条件类型（表达式、命中计数或等待断点）。

   

要向已有断点添加条件：

1. 编辑已有的断点

   • 右键点击编辑器边缘的断点，选择编辑断点。
   • 在运行和调试视图的断点部分中，选择铅笔图标表示已有的断点。

2. 编辑条件（表达式、命中计数或等待断点）。

如果调试器不支持条件断点，则无法使用添加条件断点和编辑条件作。

触发断点

触发断点是一种条件断点，一旦触发另一个断点就会被启用。它们在诊断仅在某个前提条件之后才出现的代码故障时非常有用。

触发断点可以通过右键点击字形边缘，选择添加触发断点，然后选择启用该断点的其他断点来设置。

串联断点

只有当执行到达与该内联断点相关的列时，内联断点才会被触发。这在调试压缩代码时非常有用，因为压缩代码包含一行中包含多个语句。

内联断点可以通过 ⇧F9（Windows、Linux Shift+F9）或在调试时通过右键菜单设置。内联断点在编辑器中以内联显示。

内联断点也可以有条件。通过编辑器左边距的上下文菜单，可以编辑同一行的多个断点。

函数断点

调试器可以通过指定函数名称来支持创建断点，而不是直接在源代码中放置断点。这在无法获得源代码但已知函数名称的情况下非常有用。

要创建函数断点，请在 BREAKPOINTS 部分的头中选择 + 按钮，输入函数名称。函数断点在断点部分用红色三角形表示。

数据断点

如果调试器支持数据断点，可以在VARIABLES视图的上下文菜单中设置断点。“值变/读/访问断点”命令会在底层变量的值发生变化/读取/访问时触发数据断点。数据断点在断点部分用红色六边形表示。

日志点

日志点是一种断点的变体，它不会中断调试器，而是将消息记录到调试控制台。Logpoints 可以帮助你节省时间，无需在代码中添加或删除日志语句。

对地点由菱形图标表示。日志消息为纯文本，但也可以包含需要在大括号内评估的表达式（'{}'）。

要添加日志点，请在编辑器左边距右键点击并选择添加日志点，或在命令面板中使用调试：添加日志点......命令（Windows，Linux Ctrl+Shift+P）中的 Debug： Add Logpoint...命令。你也可以配置设置

就像普通断点一样，日志点可以启用或禁用，也可以通过条件和/或命中计数来控制。

数据检查

运行与调试视图

在调试会话中，你可以在“运行”和调试视图的“变量”部分检查变量和表达式，或者在编辑器中将鼠标悬停在其源代码上。变量值和表达式的评估是相对于调用栈部分中所选栈帧的。

要在调试过程中更改变量的值，请在VARIABLES部分右键点击该变量并选择Set Value（Windows，Linux F2））。

此外，您可以使用复制值作复制变量的值，或使用复制为表达式作以访问该变量。然后你可以在“观察”部分使用这个表达式。

变量和表达式也可以在运行和调试视图的WATCH部分中被评估和监控。

要按变量名称或值筛选变量，使用⌥⌘F（Windows，Linux Ctrl+Alt+F）快捷键，当焦点放在变量部分时，输入搜索词。

调试控制台REPL

表达式可以通过调试控制台的REPL（读取-评估-打印循环）功能进行评估。要打开调试控制台，请使用调试面板顶部的调试控制台作，或使用视图：调试控制台命令（⇧⌘Y（Windows，Linux Ctrl+Shift+Y））。

你按下回车后会评估表达式，调试控制台的 REPL 会在你输入时显示建议。如果需要输入多行，使用Shift+Enter键，然后用回车键发送所有行进行评估。

调试控制台输入使用主动编辑器的模式，这意味着调试控制台输入支持语法着色、缩进、引号自动关闭及其他语言功能。

多目标调试

对于涉及多个进程的复杂场景（例如客户端和服务器），VS Code支持多目标调试。在你开始第一个调试会话后，可以启动另一个调试会话。一旦第二个会话启动并运行，VS Code 界面就会切换为多目标模式：

• 各个会话现在作为顶层元素出现在调用堆栈视图中。

  

• 调试工具栏显示当前活跃的会话（其他会话均可在下拉菜单中查看）。

  

• 调试作（例如调试工具栏中的所有作）都在活动会话上执行。激活会话可以通过调试工具栏的下拉菜单或在调用栈视图中选择其他元素来更改。

远程调试

VS Code 不支持跨所有语言的内置远程调试。远程调试是你使用的调试扩展的一个功能，建议你在市场中查看该扩展的页面以获取支持和详情。

不过有一个例外：VS Code中包含的Node.js调试器支持远程调试。更多信息请参见Node.js调试。

调试器扩展

VS Code 内置了对Node.js运行时的调试支持，可以调试 JavaScript、TypeScript 或其他任何转为 JavaScript 的语言。

对于调试其他语言和运行环境（包括 PHP、Ruby、Go、C#、Python、C++、PowerShell 等多种语言），可以寻找调试器在Visual Studio市场中选择扩展，或在顶层运行菜单中选择“安装额外调试器”。

以下是几个流行的扩展，包含了调试支持：

下一步

想了解VS Code的Node.js调试支持，请关注：

• Node.js - 描述包含在 VS Code 中的 Node.js 调试器。
• TypeScript——Node.js调试器也支持 TypeScript 调试。

想看调试基础教程，可以看这个视频：

• 入门VS Code调试——学习VS Code调试。

想了解更多关于 Copilot 和 AI 辅助调试在 VS Code 中的应用：

• 调试和修复 Copilot 的问题
• Copilot 调试和修复问题的速查表

想了解通过VS Code扩展支持其他编程语言的调试：

• C++
• Python
• Java

想了解VS Code的任务运行支持，请访问：

• 任务——描述如何与Gulp、Grunt和Jake一起运行任务，以及如何显示错误和警告。

要编写自己的调试器扩展，请访问：

• 调试器扩展——使用模拟样本说明创建 VS Code 调试扩展所需的步骤。

常见问题

支持哪些调试场景？

Linux、macOS 和 Windows 的 VS Code 开箱即用支持 Node.js 应用程序调试。市场上可用的VS Code扩展支持许多其他场景。