one<< click 中调试 Angular 应用程序？

【问题标题】：How to debug an Angular application in >>one<< click with WebStorm?如何使用 WebStorm 在 >>one<< click 中调试 Angular 应用程序？
【发布时间】：2018-05-08 21:33:35
【问题描述】：

好的，我已经检查过了：

Jetbrains 博客上描述的解决方案有效，但有一点让我很困扰：

运行npm start 使应用程序在开发模式下运行。你可以在终端中或通过双击 WebStorm 中的 npm 工具窗口。

显然，我尝试将 npm start / ng serve 放在实际调试之前，但您可能知道这实际上阻塞了调试阶段：

如果不单独手动启动它们似乎不可能同时运行和停止。

任何解决方法/解决方案？

【问题讨论】：

标签： angular npm webstorm

【解决方案1】：

将一个 NPM 运行配置添加到 Before launch 部分将不起作用，因为主进程将等待 Before launch 中运行的进程返回代码 （在终止之前不会启动）。这就是“启动前”的设计方式——它应该用于在运行主进程之前运行某种预处理。如果需要同时调试两个进程，可以试试自定义Multirun plugin：

更新：自 2018.1 起，您还可以为此使用 Compound 运行配置。唯一的缺点（与 Multirun 相比）是无法指定执行顺序和延迟，因此两种配置将同时运行，一旦 webpack 构建完成，您将刷新浏览器

【讨论】：

谢谢，我要试试这个。
是否有任何解决方案可以在运行/调试配置中启动 ng serve 而无需使用 npm start？
不，没有运行任意命令的运行配置。
另外，您可以在 WebStorm 中使用 Compound 运行配置时间，并向其中添加 JavaScript 调试和 npm 启动配置。它的工作原理类似于上面建议的 Multirun 插件。