调试工具窗口
当您 启动调试器会话时, 调试 工具窗口会打开。 使用此窗口 控制调试器会话, 查看和分析程序数据 (帧、线程、变量等),并执行调试器操作。
默认情况下,当程序遇到断点时, 调试 工具窗口会打开,并且在会话终止时不会隐藏。 要更改此行为,请转到 生成、执行、部署 | 调试器 设置页面  Ctrl+Alt+S 并取消选中 在断点时显示调试窗口 复选框。
会话
如果您同时运行多个调试会话,它们会在 调试 工具窗口顶部的选项卡中分开。

编辑器中的所有信息,例如 内联变量值和执行点,都会显示在选定的会话选项卡中。 如果您正在运行多个使用相同类的调试会话,这一点很重要。
当您关闭一个选项卡时,相应的调试会话会终止。
标签页
调试 工具窗口为每个会话显示以下选项卡:
帧 :使用此窗格在调用堆栈中导航并在调试多进程 Node.js 应用程序或 Service Workers 时在线程之间切换。

变量 :列出当前上下文中的变量,并让您分析和修改程序状态。
Watches :允许您管理 Watches。 默认情况下,观察会显示在 变量 选项卡上,以更高效地使用屏幕空间。 如果您有很多监视项,建议在单独的选项卡中查看。
控制台:显示程序输出。
对于客户端应用程序,该选项卡还显示代码中记录的所有内容(例如,使用
console.*),并且还充当 读取-求值-打印循环 (REPL ),因此您可以在其中运行 JavaScript 代码片段并与当前调试的页面交互。 了解更多 交互式调试器控制台进程控制台 :WebStorm 在您调试 Node.js 应用程序时打开此选项卡。 该选项卡显示节点进程本身的输出,即直接写入 process.stdout和 process.stderr的所有内容,或使用 console.*记录的内容。 从 使用交互式调试控制台 了解更多。

调试器控制台 :WebStorm 在您调试 Node.js 应用程序时打开此选项卡。 在这里,您可以运行 JavaScript 代码片段并查看 console.*消息。
请从 使用交互式调试控制台 了解更多。
脚本 :在 JavaScript 调试会话期间,该选项卡显示在 JavaScript 代码执行期间自动下载的所有外部资源。 使用此选项卡监控外部资源的下载。 要在编辑器中打开资源的代码,请双击相关项目。
元素 :此选项卡显示活动浏览器页面的实际 HTML 源代码和 HTML DOM 结构。 使用此选项卡监控通过浏览器对页面所做的更改。
该选项卡仅在调试客户端代码时可用。
切换选项卡
要在工具窗口选项卡中循环切换,请按 Alt+Right 和 Alt+Left。
显示/隐藏标签
点击
并选择您想要查看的选项卡。
移动选项卡
您可以根据个人偏好排列标签页。 您可以将一个标签移到另一个位置或将一个标签与另一个标签分组,使它们在屏幕上共享相同的空间。
将标签页标题拖到所需位置。 蓝色框架表示目标位置。
恢复默认布局
如果您更改了 调试 工具窗口的布局,而不喜欢新的排列方式,您可以将其恢复到默认状态。
点击
,在 调试 工具窗口的右上角,然后点击 恢复默认布局。

工具栏

您可以根据自己的喜好配置工具栏上可用的操作列表。
自定义调试器工具栏
要添加调试操作,请右键点击调试器工具栏,从上下文菜单中选择 添加到调试器工具栏 ,然后从列表中选择所需的操作。

要添加与调试无直接关系的操作,请右键点击调试器工具栏,然后从上下文菜单中选择 自定义工具栏。

在打开的对话框中,点击 添加 ,然后选择所需的操作。
