如何在PhpStorm/WebStorm中調試angular2種子項目？

我正在使用Angular2 seed project，我無法讓PhpStorm（WebStorm）進行調試 - 它不會停止在.ts文件中的斷點處。

何去做嗎？

現在我使用JavaScript Debug與http://localhost:8080爲URL - 無斷點：/

2016-01-14 piernik

要在WebStorm中進行調試，您需要確保生成源映射。要做到這一點，打開angular2-seed\webpack.config.js並添加

devtool: 'source-map',

到的WebPack配置;然後建立JavaScript網頁調試運行配置與網址，並添加以下Remote URL映射項目的根目錄

webpack:///.

現在，npm start啓動服務器;一旦服務器啓動，通過按調試

2016-01-14 12:40:11 lena

工作原理 - 非常感謝 – piernik

您可以使用「角batarang」工具，調試

2016-01-14 09:04:24

在調試器中運行上述配置，可以將此答案添加爲註釋。在你提供更多的信息吧擁有它 –

對於Angular2來說，它會是一個相當不錯的選擇嗎？ ;-) –

-1

把斷點到您的打字稿文件，並一步一步執行在Chrome開發工具中可以進行處理。

你試試了嗎？

希望它可以幫助你。蒂埃裏

2016-01-14 09:11:08

我知道鉻有調試器，但我使用phpStorm作爲IDE並要求phpStorm。但感謝您的回覆 – piernik

我的意思是，您可以隨時在瀏覽器（例如chrome）中執行客戶端應用程序（angular2），然後使用其內置的調試器... –

如果您使用的是Chrome，在你的代碼編寫（要打破）：

debugger;

打開瀏覽器，點擊F12（開發者控制檯），比刷新頁面。應用程序的執行應停止在該命令上。

請注意，您的tslint（如果您使用的話）可能會抱怨使用調試器命令。編輯你的tslint.json文件，並把no-debugger設爲true

2016-01-14 09:18:28

回答