# 调试服务器端和客户端代码

> For the complete documentation index, see [llms.txt](https://www.jetbrains.com.cn/help/idea/llms.txt).

> **TL;DR**
> 所需插件  :
>
>
>
> `JavaScript 和 TypeScript`  -  插件与 IntelliJ IDEA 捆绑在一起，并默认启用。
>
>
>
> `Node.js` ，  `JavaScript Debugger`  -  在   设置 | 插件   页面上安装插件。 插件仅在具有 Ultimate 订阅的 IntelliJ IDEA 中可用。

> **Note:**
> JavaScript 客户端代码的调试仅支持在 [Google Chrome](http://www.google.com/chrome/) 和其他 [Chromium-based browsers](https://www.chromium.org/) 中进行。

通过 IntelliJ IDEA，您可以调试 Node.js 应用程序的服务器端代码以及其客户端 JavaScript 代码。 为此，您需要创建并启动一个  JavaScript Debug  配置以及一个  Node.js  配置。

通过 IntelliJ IDEA，您可以在创建或编辑主要的 Node.js 配置时，从   实时编辑   选项卡中创建一个 JavaScript Debug 配置。 在这种情况下，每次您启动 Node.js 配置时，JavaScript Debug 配置都会自动启动。

![使用一个运行/调试配置启动调试服务器和客户端代码](https://resources.jetbrains.com.cn/help/img/idea/2026.3/node_debug_server_client.animated.gif)

或者，从   编辑配置  对话框（  `运行 | 编辑配置` ）中创建一个 JavaScript Debug 配置，然后单独启动这些配置。

Procedure: 创建两个运行/调试配置

1. 从   运行   小部件的列表中，选择  Node.js  运行配置以与  JavaScript Debug  配置一起启动。 然后点击 ![更多按钮](https://resources.jetbrains.com.cn/help/img/idea/2026.3/app.expui.general.moreVertical.svg)并从菜单中选择   编辑  。

![从运行小部件中选择一个 Node.js 运行/调试配置](https://resources.jetbrains.com.cn/help/img/idea/2026.3/调试配置：Node.js 对话框，切换到浏览器/实时编辑选项卡](https://resources.jetbrains.com.cn/help/img/idea/2026.3/ws_node_run_config_select_live_edit_tab.png)

3. 在   浏览器 / Live Edit  选项卡中，选择   在启动后  ，以便在您启动调试会话时自动启动浏览器。 在下方字段中输入 URL地址以打开应用程序。

从   在启动后   复选框旁边的列表中选择要使用的浏览器。

* 要使用系统默认浏览器，请选择 默认 。

* 要使用自定义浏览器，请从列表中选择。 请注意，仅在 [Google Chrome](http://www.google.com/chrome/) 和其他 [基于 Chromium 的浏览器](https://www.chromium.org/) 中支持调试 JavaScript 客户端代码。

* 若要配置浏览器，请点击 ![浏览按钮](https://resources.jetbrains.com.cn/help/img/idea/2026.3/app.general.ellipsis.svg)并在打开的 Web 浏览器和预览 对话框中调整设置。 有关更多信息，请参阅 [Web 浏览器](configuring-third-party-tools.html#web-browsers)。

请选择   使用 JavaScript 调试器   复选框。

![Node.js 运行/调试配置：浏览器/实时编辑选项卡](https://resources.jetbrains.com.cn/help/img/idea/2026.3/ws_node_run_config_live_edit_tab.png)

Procedure: 开始一个会话以调试服务器和客户端代码

1. 从   运行   小部件的列表中，选择修改后的  Node.js  运行配置，然后点击旁边的 ![调试图标](https://resources.jetbrains.com.cn/help/img/idea/2026.3/app-client.expui.run.debug.svg)。

![要同时启动两个 run/debug 配置，请选择主要的 Node.js run/debug 配置](https://resources.jetbrains.com.cn/help/img/idea/2026.3/node_debug_server_client_select_rc.png)

2. 打开的   调试  工具窗口有两个选项卡——一个用于 Node.js 运行/调试配置的选项卡和一个用于 Javascript Debug 运行/调试配置的选项卡。 哪个选项卡处于活动状态取决于第一个命中断点的位置。

![带有两个标签页的调试工具窗口](https://resources.jetbrains.com.cn/help/img/idea/2026.3/node_debug_server_client_debug_tool_window_two_tabs.png)

继续调试会话—— [逐步检查断点](stepping-through-the-program.html)、在帧之间切换、动态更改值、 [检查挂起的程序](examining-suspended-program.html)、 [评估表达式](examining-suspended-program.html#evaluating-expressions)并 [设置监视](examining-suspended-program.html#watches)。

3. 当浏览器打开时，执行将触发代码执行的步骤。 例如，在浏览器中从应用程序的起始页面导航到另一个页面。

![在浏览器中触发应用程序执行](https://resources.jetbrains.com.cn/help/img/idea/2026.3/node_debug_server_client_browser_trigger_app.png)

4. 当客户端代码中的第一个断点命中时，应用程序停止，浏览器中的页面重新加载，   调试   工具窗口中的焦点移到带有 JavaScript Debug 配置的选项卡。

![此应用程序在浏览器中已暂停](https://resources.jetbrains.com.cn/help/img/idea/2026.3/node_debug_server_client_paused_in_browser.png)

继续调试会话—— [单步执行断点](stepping-through-the-program.html)，在帧之间切换，即时更改数值， [检查已挂起的程序](examining-suspended-program.html)， [评估表达式](examining-suspended-program.html#evaluating-expressions)，并 [设置观察点](examining-suspended-program.html#watches)。