运行/调试多个目标

使用复合运行/调试配置进行并行启动

复合 运行配置允许您同时启动多个 运行/调试 配置。

启动 复合 配置时，其中所有配置将以相同模式启动，即 运行 或 调试。 因此，为在调试客户端和服务器端之前以开发模式启动应用，您可以从 package.json 运行 npm 脚本，或将其配置为启动前任务，或创建单独的 npm 运行配置。

使用“启动前”任务按顺序启动

您可以使用 运行/调试 配置的 启动前 任务 执行不同任务 ，包括启动其他 运行/调试 配置。 例如，您可以向 React Native 配置添加一个 npm 脚本以启动打包器。

WebStorm 支持以下“启动前”任务：

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

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

• 运行另一个配置 ：选择此项以执行其他运行／调试配置，并在其完成后再启动当前配置。 如果您希望并行运行多个配置，请使用 compound run/debug configuration。

• 运行File Watcher ：选择此项以让 WebStorm 应用所有当前处于活动状态的 File Watchers。

• 运行远程外部工具 ：添加一个 remote SSH external tool。

• 运行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 settings。

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

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

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

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

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

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

• 上传文件到远程主机 ：选择此项以根据 default server access configuration ，将应用文件自动 uploaded to the server。

• 断开数据源 ：如果希望在运行／调试配置执行前中断与数据源的连接，请选择此选项。