WebStorm 2025.2 Help

运行/调试配置

WebStorm 使用运行/调试配置运行、调试和测试您的代码。每个配置都是一组命名的启动属性，用于定义要执行的内容、参数及所需的环境。 每个配置都是一组命名的启动属性，用于定义要执行的内容、参数及所需的环境。

运行/调试 配置分为两种：

  • 临时 — 每次从上下文菜单中选择 运行 <item_name> 时创建。 要打开上下文菜单，请右键单击某个对象或区域。

  • 永久 — 通过模板显式创建或将临时配置保存而来。 永久配置将保留在项目中，直到您将其删除。

每当您运行、调试或测试代码时，WebStorm 会使用已有的永久运行/调试配置，或创建一个新的临时配置。

永久配置的图标为不透明，临时配置的图标为半透明。图标上的红色叉号表示配置设置存在错误。 图标上的红色叉号表示配置设置存在错误。

临时配置的最大数量为 5 个。 添加新配置时，旧配置将自动删除。 如有需要，您可以在 设置 | 高级设置 | 运行/调试 | 临时配置限制 中增加此限制。

永久和临时配置的图标不同

创建永久运行/调试配置

WebStorm 提供以下方法来创建永久运行/调试配置：

将临时配置保存为永久配置

  • 在 运行/调试 配置切换器中选择一个临时配置，点击 并选择 保存配置。

    运行/调试配置选择器：保存配置

  • 或者，在运行/调试配置对话框中选择一个临时配置，然后点击工具栏中的 保存。

  • 打开 编辑配置 对话框（运行 | 编辑配置 ），选择要保存的临时配置，然后点击工具栏中的 保存配置。

    在“编辑配置”对话框中保存临时运行配置

WebStorm 为不同的语言、工具和框架提供运行/调试配置 模板。 可用模板列表取决于已安装并启用的 插件。

从模板创建运行/调试配置

  1. 进入 运行 | 编辑配置。 或者按 Alt+Shift+F10 ，然后按 0。

  2. 在 运行/调试配置 对话框中，点击工具栏上的 或按 Alt+Insert。 该列表显示运行/调试配置模板。

    选择所需模板。 如果不确定选择哪个模板，请参阅 运行/调试配置对话框 了解特定模板的更多信息。

    创建运行/调试配置：选择配置类型

  3. 在 名称 字段中指定运行/调试配置名称。 该名称将在列表和菜单中用于标识运行/调试配置。

  4. 如果希望允许同时运行配置的多个实例，请选择 允许多个实例(U)。 如果未启用此选项，重新运行配置将终止当前会话。

  5. 配置运行/调试配置参数。 必填和可选参数的列表可能会因所选运行/调试配置类型而异。

    部分可选参数被隐藏。 要查看并启用这些参数，请点击 修改选项 链接。

    有关所选模板的详细说明，请参见 运行/调试配置参考 的相应部分。

  6. 在 启动前 部分中，定义是否要在启动应用程序之前执行特定操作，例如在启动 run/debug configuration 之前先执行某些工具或脚本。

    有关特定 启动前 活动的更多信息，请参见 启动前

  7. 您可以立即运行该配置，也可以将其保存以便稍后运行。

    • 若要将运行配置保存以便之后使用，请点击 确定。

    • 若要立即运行该配置，请点击 运行。

启动前

在此区域，您可以指定在启动所选 run/debug configuration 之前需执行的任务。 任务将按照它们在列表中的顺序依次执行。

项目

快捷键

描述

添加按钮

Alt+Insert

单击此图标以添加以下可用任务之一：

  • 启动Web 浏览器 ：选择此选项以启动浏览器。 在打开的对话框中，选择浏览器类型并提供起始 URL。 还可以指定是否希望以 JavaScript 调试器启动浏览器。

  • 运行外部工具 ：选择以运行外部应用程序。 在打开的对话框中，选择要运行的一个或多个应用程序。 如果在 WebStorm 中尚未定义，请添加其定义。 更多信息，请参见 外部工具 和 外部工具。

  • 运行另一个配置 ：选择此项可执行另一个 run/debug configuration，并在启动当前配置前等待前者结束。 如果希望并行运行多个配置，请使用 复合运行/调试配置。

  • 运行File Watcher ：选择此选项可使 WebStorm 应用所有当前启用的 File Watcher。

  • 运行远程外部工具 ：添加 远程 SSH 外部工具。

  • 运行Grunt 任务 ：选择此项以运行 Grunt 任务。

    在打开的 Grunt 任务 对话框中，指定定义所需任务的 Gruntfile.js ，选择要执行的任务，并指定传递给 Grunt 工具的参数。

    指定 Node.js 解释器的位置、传递给它的参数以及 grunt-cli 包的路径。

  • 运行gulp 任务 ：选择此项以运行 Gulp 任务。

    在打开的 Gulp 任务 对话框中，指定定义所需任务的 Gulpfile.js ，选择要执行的任务，并指定传递给 Gulp 工具的参数。

    指定 Node.js 解释器的位置、传递给它的参数以及 gulp 包的路径。

  • 运行npm 脚本 ：选择此项以执行 npm 脚本。

    在打开的 NPM 脚本 对话框中，指定 npm run/debug configuration 设置。

  • 启动React Native Bundler ：选择此项以在运行或调试会话中自动运行 bundler。 默认情况下，将通过 react-native start 完成此操作。

    如果应用程序使用 Expo ，则需要通过 start npm 任务运行开发服务器。 为此，请点击 添加 ，然后在打开的 配置 React Native 对话框中，选择 npm 脚本 并从列表中选择 start。

  • 编译TypeScript ：选择此项运行内置的 TypeScript 编译器，从而确保您对 TypeScript 代码所做的所有更改都已反映到生成的 JavaScript 文件中。 在打开的 TypeScript 编译设置 对话框中，选中或取消选中 检查错误 复选框，以配置在检测到错误时编译器的行为：

    • 如果选中 检查错误 复选框，编译器将显示所有错误，并且运行配置将不会启动。

    • 如果未选中 检查错误 复选框，编译器仍会显示所有检测到的错误，但运行配置将继续启动。

  • 生成CoffeeScript 源映射 ：选择此项可为 CoffeeScript 源文件生成 source map。 在打开的对话框中指定 CoffeeScript 源文件的位置。

  • 上传文件到远程主机 ：选择此项可根据 默认服务器访问配置 ，将应用程序文件自动 上传到服务器。

  • 断开数据源 ：若要在 run/debug configuration 启动前中断与数据源的连接，请选择此项。

移除按钮

Alt+Delete

点击此图标可将所选任务从列表中移除。

编辑

Enter

点击此图标可编辑所选任务。 在打开的对话框中进行必要的更改。

方法上移

方法下移

Alt+Up

Alt+Down

点击这些图标可将所选任务在列表中向上或向下移动一行。 任务将按其在列表中的顺序执行。

显示此页面

选中此复选框可在实际启动 run/debug configuration 前显示其设置。

激活工具窗口

默认情况下，该复选框处于选中状态，并在启动 run/debug configuration 时打开 运行 或 调试 工具窗口。

否则，如果未选中该复选框，则工具窗口将被隐藏。 不过，在配置运行过程中，您可以通过按 Alt+4 或 Alt+5 手动打开相应的工具窗口。

启动运行配置

您可以通过以下任一方式启动已有的运行配置：

  • 如果 运行小组件 中已选中该运行配置，请点击其旁边的 ，或按 Shift+F10 键。

    运行工具窗口附近的“运行”按钮

  • 如果您想选择其他运行配置，请单击 运行小部件。 在打开的菜单中，单击您要启动的运行配置旁的 。

    运行工具窗口菜单中运行配置旁的“运行”按钮

  • 按 Alt+Shift+F10。 在打开的菜单中，单击您要启动的运行配置。

共享运行/调试配置

您可能希望共享您的 运行/调试 配置，以便团队成员可以使用相同的配置运行应用程序，或使其能够远程附加到您正在运行的进程。

WebStorm 提供了一种机制，可将您的 运行/调试 配置存储为项目文件，并通过 VCS 进行共享。 当您希望将配置作为文件发送给他人、创建运行/调试配置的本地备份或从文件导入配置时，也可以使用同样的机制。

旧版基于 .ipr 的项目不支持单独的 运行/调试 配置。 对于旧版项目，您只能通过将 .ipr 文件添加到 VCS 中来一次性共享所有配置。

  1. 转到 运行 | 编辑配置。 或者按 Alt+Shift+F10 ，然后按 0。

  2. 选择要共享的 运行/调试 配置，启用 存储为项目文件(S) 选项，并指定将存储配置文件的位置。

    除非需要与 WebStorm 2019.3 及更早版本兼容，否则可配置任意位置。 为确保与这些版本兼容，请将文件存储在建议的位置。

    作为项目文件保存框

  3. （可选）如果 .idea 目录已添加到 VCS 忽略文件中，则 .idea/runConfigurations 子文件夹也将被忽略。 如果项目使用 Git，您可以共享 .idea/runConfigurations 并通过修改 .gitignore 保持 .idea 被忽略，方法如下：

    /.idea/* !/.idea/runConfigurations

运行/调试配置模板

所有运行/调试配置都是基于模板的，这些模板实现启动逻辑，定义参数列表及其默认值。 可用模板列表 是在安装过程中预定义的，只能通过 插件 扩展。 但是，您可以编辑每个模板中的默认参数值，以便更容易地创建新的运行/调试配置。

配置模板的默认值

  1. 转到 运行 | 编辑配置。 或者按 Alt+Shift+F10 ，然后按 0。

  2. 在 运行/调试 配置对话框的左侧窗格中，单击 编辑配置模板…。

    在运行/调试配置对话框中编辑运行/调试配置模板

  3. 在打开的 运行/调试配置模板 对话框中，选择一个配置类型。

  4. 指定所需的默认参数，然后单击 确定 保存模板。

    运行/调试模板

或者，从主菜单中选择 文件 | 新建项目设置 | 运行配置模板 ，或按两次 Shift 并开始输入 Templates for New Projects。

创建运行/调试配置模板

在打开的对话框中，选择配置类型，并在右侧窗格中指定所需的参数。

运行/调试配置文件夹

当存在多个同类型的 运行/调试 配置时，您可以将它们分组到文件夹中以便于访问。

分组的运行配置

为运行/调试配置创建文件夹

  1. 转到 运行 | 编辑配置。 或者按 Alt+Shift+F10 ，然后按 0。

  2. 在 运行/调试配置 对话框中，选择一个配置类型，并单击工具栏上的 新建文件夹图标。 将创建一个所选类型的新空文件夹。

    添加配置文件夹

  3. 在右侧的文本字段中指定文件夹名称，或接受默认名称。

    指定配置文件夹名称

  4. 选择所需的 运行/调试 配置并将其移动到目标文件夹下。

  5. 应用更改。 如果文件夹为空，则不会保存。

不再需要文件夹时，可通过 Delete 删除它。 在该文件夹下分组的 运行/调试 配置将被移动到相应 运行/调试 配置类型的根目录下。

服务工具窗口中的运行/调试配置

您可以在 服务 工具窗口中管理多个运行/调试配置。 例如，您可以启动、暂停和停止多个应用程序，跟踪它们的状态并查看应用程序的详细信息。

将运行/调试配置添加到“服务”窗口

  1. 从主菜单中选择 视图 | 工具窗口 | 服务 ，或按 Alt+8。

  2. 在 服务 工具窗口中，单击 添加服务 ，然后选择 Run Configuration Type…。

    服务工具窗口：添加运行配置

  3. 从列表中选择一个运行/调试配置类型，以便将此类型的所有配置添加到窗口中。

    请注意，工具窗口仅会显示已 创建 一个或多个配置的配置类型。

最后修改日期： 2025年 9月 26日
代码覆盖率部署您的应用