运行和调试 yo gulp-angular 和 typescript答案

【问题标题】：Run & Debug yo gulp-angular & typescript运行和调试 yo gulp-angular 和 typescript
【发布时间】：2015-09-14 06:58:32
【问题描述】：

我使用yo gulp-angular (https://github.com/Swiip/generator-gulp-angular) 生成器来创建我的typescript/angular/gulp 项目。在此处的命令借阅代码中一切正常，我可以轻松运行项目。但是，在 web Storm 10.0.4 中运行和调试 typecipt 存在一些问题

我正在尝试在调试模式下运行gulp serve（在运行模式下它启动良好）并收到消息Debugger listening on port 58032，但没有任何反应。

是否有任何综合指南，如何调试和运行基于gulp 的打字稿 enter code hereprojects 有网络风暴或其他 IDE？这种设置的最佳 IDE 是什么？

谢谢

【问题讨论】：

我正在尝试让它与 Visual Studio Code (code.visualstudio.com) 一起工作并且遇到同样的问题。 gulp serve 任务只运行 BrowserSync，但没有节点进程可以附加调试器。非常感谢任何帮助，因为我的想法已经不多了。顺便说一句，手动启动节点进程将不起作用（即 node --debug=5858 src/app/index.ts 也不适用于 JS 文件 node --debug=5858 .tmp/serve/app/index.js）
顺便说一句，因为这是一个类似的问题，但面向不同的 IDE（Visual Studio 代码），我创建了一个单独的问题：stackoverflow.com/questions/31310957/…。希望它得到 VSC 开发人员的关注

标签： debugging gulp webstorm typescript1.4

【解决方案1】：

我对 Webstorm 不是很熟悉，但我使用 Swiip Gulp Angular Generator，默认情况下 browsersync 实例将在端口 3000（或下一个可用端口）上运行，所以我猜你是否将端口设置为相同值你将使 Webstorm 调试工作

要更改 Gulp Serve 任务的端口，请转到 gulp/server.js

browserSync.instance = browserSync.init({
  startPath: '/',
  port: 58032,
  server: server,
  browser: browser
});

【讨论】：

你如何调试 typescript 以及你使用的是什么 IDE？我并没有真正受制于网络风暴，我正在寻找具有复杂自动完成和调试选项的 ide。
我主要是 UI 设计师/开发人员，不会做很多复杂的 JS 编码，所以我真的不需要调试器，因此我只想要一些快速的东西，让我可以创建干净的代码，所以我使用 Sublime Text 或最近的 Atom。这就是说我听说过关于 Webstorm 的好消息，所以如果我要查看使用调试器的工具，我会选择 Webstorm
嗯，Chrome 是一个很棒的调试工具。如果你有地图文件，你可以毫不费力地调试打字稿。

【解决方案2】：

在调试模式下运行 gulp serve 意味着 WebStorm 将为您的任务启动 Node.js 调试会话。如果您想调试您的客户端代码，您需要为 URL 启动一个新的 JavaScript 调试会话：http://localhost:3000/。确保您已准备好所有源映射。

【讨论】：