Visual Studio代碼調試客戶端JavaScript

我正在使用Visual Studio代碼爲一個JavaScript項目。您可以設置斷點並逐步完成並非常容易地調試在nodejs中運行的代碼。有什麼辦法可以允許客戶端的斷點和調試，瀏覽器運行代碼？Visual Studio代碼調試客戶端JavaScript

通過console.log進行調試變得非常快速。

對於在Chrome中進行調試，有Visual Studio Code: Debugger for Chrome extension。您可以在市場上找到該擴展，search用於調試器，如debugging manual中所述。不幸的是，（目前）不支持其他瀏覽器，

調試node.js開箱即用，請參閱上面的調試手冊或John Papa的blog post。

調試客戶端和服務器（至少菲爾評論）至少在我看來是不可能的，因爲你需要有兩種不同的啓動配置，對不起。

2016-03-23 11:31:53 ChrLipp

很棒的回答。問題是我有一個有服務器代碼和客戶端代碼的節點項目。對於調試客戶端代碼，使用擴展似乎很好，但它不允許我運行節點，以便後端在調試前端的同時運行。 –

而且，瀏覽器的調試工具有什麼問題？我不是在向控制檯輸出數據，而是在逐步執行代碼。您可以使用'debugger;'語句來查找您不容易找到的源文件或者通過AJAX下載並立即執行的代碼塊/文件。您可以在Visual Studio中調試IE的處理，但不能在其他瀏覽器AFAIK中處理。 –

您應該使用所有現代瀏覽器都具有的開發人員工具（F12）。我更喜歡chrome，因爲workspaces可以在瀏覽器中內聯編輯您的代碼。

2015-10-29 06:20:48

那麼，答案是否定的？如何使用phantomjs和visual studio代碼來獲得與nodejs相同的體驗？ –

我描述了前端瀏覽器代碼的調試過程。並且對於前端答案是否定的。因爲（如果我將調試過程正確）VS代碼應該附加到Chrome瀏覽器進行調試，因爲它是兩個不同的過程。這不是簡單的任務。 Chrome的答案是使用工作區並在瀏覽器中編輯代碼。關於PhantomJS，它沒有任何UI，所以你如何與它進行交互？ –

通過在chorme瀏覽器中打開項目並使用chrome DevTools。你可以隨心所欲地調試它。

步驟：

如果你的意思是調試Nodejs，因爲我知道有一個名爲「debuger」的npm包？

2016-03-29 08:54:59

另一種技術是使用Visual Studio代碼：Debugger for Chrome擴展。保存node.js的launch.json配置的內容並將其刪除。然後創建Chrome launch.json。將這兩者結合起來，你可以在代碼中調試服務器或客戶端（但不能同時）。

要調試客戶端，服務器必須正在運行，因此從命令提示符使用啓動服務器的「node」命令。在代碼中啓動Chrome調試器並調試客戶端。

2016-04-27 19:26:33

回答