使用Chrome DevTools直接調試Node.js與JavaScript(並行)

Good News： 如今咱們能夠用瀏覽器調試node.js了!!!

前提

• Node.js 6.3+, 這個可上Node.js官網自行下載；
• Chrome 55+. 若是您本地的chrome升級到最新版後仍是<55, 能夠今後處下載：Chrome Canary，親測可行。

配置

就目前來講，在瀏覽器端並行調試JavaScript與Node.js還屬於新特性，新體驗。爲了可以正常使用，你還須要作以下配置：

• 輸入url：chrome://flags/#enable-devtools-experiments. 注：若是使用中文版Chrome，顯示的配置項名稱應該爲： 開發者工具實驗性功能 ,以下圖;
  
• 啓用它;
• 重啓Chrome;
• 打開 DevTools Setting -> Experiments 頁卡;
• 找到 Node debugging , 勾選.

最後應該能看到相似下圖，表示環境已準備好:

調試

調試很簡單，像普通的js文件同樣，利用DevTools進行斷點調試.

運行Node.js app

須要在debug模式下運行Node.js應用，很簡單，只要添加 –inspect 參數便可。

1	node --inpect server.js

 

注：server.js 爲我本身的應用文件，自定義，下圖中爲’ node.js ‘。若是順利的話，應該能看到相似下圖信息：

運行後，能夠看到在 DevTools -> Sources 有 server.js 應用：

展開後，能夠查看當前node應用的js文件，至此，您已經能夠利用Chrome進行並行調試操做了。

最後

使用此新版Chrome，還有許多其餘的功能，好比在調試期間修改文件內容、保存文件快照等。
最後的最後，感謝原做者 Serg Hospodarets 的分享，Thank You!