使用 ndb 調試你的 Node.js 項目

代碼調試按照調試方式大體分爲 日誌(Log)斷點(Breakpoint) 兩種辦法。其中日誌就是手動的在代碼中增長日誌打印獲取過程信息來判斷問題。這種方法的好處是調試簡單,一個對業務熟練的工程師經過線上良好的日誌記錄能夠很是快的發現業務問題。可是它的缺點也很是明顯,獲取的內容比較單一,動態調試須要不斷的在業務中增長日誌打印代碼。javascript

因而乎斷點調試出現了。斷點調試相似於中醫的望聞問切,咱們經過在須要觀察的點打上斷點就能詳細的獲取到程序運行到該點時的全部上下文,並利用單步調試逐一觀察程序運行情況,準確判斷出問題的地方。另外利用 Chrome DevTool 咱們也能夠隨時對線上業務進行調試,能夠說是很是方便了。html

V8 Inspector

在前端使用 Chrome DevTool 進行斷點調試已是很是成熟了,在 Node.js(6.3+) 中也自帶了一個相似的調試器,主要是在 Node 內部實現了一套 v8 調試器通訊協議。啓動的時候添加 --inspect 參數,咱們就能獲得 Chrome DevTools 調試界面了,剩下的調試過程就和正常的 Chrome 調試是同樣了。前端

1_32J7CSAzBtm68CwiVS0Ukw.png

:Users:lizheming:Desktop:1_-W3U7eUzBnnDu6dTlx9TnQ.jpg

使用 --inspect 調試極大的方便了 Node.js 開發,讓服務端調試也有了相似前端調試同樣的體驗。除了直接打開 DevTools 調試,VSCode, WebStorm 等開發工具也將其集成到了編輯器中,不過內部的原理是相似的。不過人無完人,在使用過程當中 Node Inspector 調試也存在着一些缺點:java

  • 須要在 node 命令後增長 --inspect 參數,對於一些第三方命令啓動沒法直接支持調試,例如 webpack, ava, mocha...
  • 多進程調試很是的麻煩,特別是子進程頻繁的銷燬的時候,須要外部手動的監聽進程的建立並手工將進程和調試工具進行通訊對接

注: 雖然 VSCode 使用的是 Inspector Protocol 模式,不過在 1.22 的版本中已經可以自動綁定多進程監聽端口了,具體的話能夠查看天豬大大的《VSCode 調試 Egg 完美版》node

ndb

兩週前 Chrome 實驗室開源了一款新的調試工具,也就是咱們今天的主角 —— ndb。它提供了更良好的調試體驗,正如官方倉庫所說,它爲咱們帶來了以下一些特性:webpack

  1. 子進程自動檢測和調試接入
  2. 支持在模塊加載前進行斷電
  3. 支持在調試工具中直接編輯文件,保存後自動更新到本地文件
  4. 默認狀況下,ndb 會對引用的全部項目文件夾外的腳本開啓黑盒模式讓咱們能更專一業務代碼。項目文件夾外的腳本包括 Node.js 自帶的模塊文件(例如 _stream_wrap.js, async_hooks.js, fs.js 等)。固然你能夠在設置中修改「Blackbox anything outside working dir」配置來關閉這個功能。

安裝

npm install -g ndb
複製代碼

首先要確保你的 Node.js 環境 >= 8.0.0,而後使用 npm install 就能夠很是方便的完成安裝。因爲 ndb 依賴 Puppeteer 安裝過程當中會去下載 Chromium 因此下載過程可能會有必定的時間,請各位同窗耐心等待。若是有碰上權限問題官方提示能夠嘗試增長 --unsafe-perm=true --allow-root 參數解決。git

使用

不一樣於 node --inspect 的複雜使用,ndb 的使用方式很是的簡單。在全部你想要進行調試腳本執行前加入 ndb 命令便可,甚至還能直接使用 ndb 命令啓動腳本。如下是從倉庫示例中引用的一些啓動方式:github

ndb node server.js

ndb npm run test

ndb mocha

ndb .
複製代碼

--inspect 同樣,執行命令後就會彈出 Chrome DevTools 調試界面。在這個特製的調試界面中,你能夠:web

  • 斷點調試,異步方法單步調試
  • 控制檯預執行顯示(須要 Node.js >= 10)
  • JS 樣本分析
  • 內存分析
  • 本地終端

使用 ndb 進行 ThinkJS 調試

下面以基於 ThinkJS 開發的 Node.js 項目 Firekylin 爲例,簡單看看如何使用 ndb 進行斷點調試。chrome

(因爲掘金目前暫不支持嵌入視頻,因此須要你們跳轉到騰訊視頻中觀看。)
v.qq.com/x/page/t074…

能夠看到基本上調試的流程很是的簡單,而且自動適配了多進程項目(視頻中啓了8個進程),解決了以前使用 --inspect 的兩個問題。另外在底部的控制檯因爲是 REPL 環境,能夠實時獲取到斷點處當前環境的數據,例如咱們能夠打印 process.memoryUsage() 查看當前的內存使用狀況。

除了斷點調試以外,ndb 也支持內存和性能分析,能夠幫助咱們分析內存泄露和。具體的也能夠參考一下官方文檔《Chrome DevTool 解決內存問題》

ndb 的問題

仍是那句話人無完人,ndb 目前使用下來仍是以爲有一點不太舒服的地方。主要是表如今文件更新方面,目前代碼編寫仍是在代碼編輯器中,調試須要到 ndb 界面上,頻繁的切換感受有點不爽。但願後續 VSCode 能儘快將 ndb 引入替換現有的調試工具就很是方便了。

有同窗會說爲何不在 ndb 上直接編輯文件呢,畢竟支持文件編輯保存也是 ndb 做爲調試工具的一大特點。這是由於在多進程環境下每一個進程的調試是相互獨立的,你在一個進程上的文件修改只能反映在這個修改的進程上,不能在全部進程上生效,和咱們本地操做文件不太同樣,使用上須要注意。不過這個也比較好解決,調試的時候只開啓一個進程就能夠了。

後記

Node.js 已經有愈來愈多的工具能夠幫助咱們進行斷點調試了,從早期的 Debug Protocol 到前兩年開始支持的 V8 Inspector Protocol 到如今的 ndb,咱們看到了技術正在一步步的朝前走着,固然咱們這裏須要先感謝下 Chrome 工程師們,感謝他們開發出了這麼棒的工具。固然除了斷點單步調試以外,日誌調試也有它存在的必要,二者能夠相輔相成沒有孰好孰壞之分。

最後,送一張圖給你們祝你們新的一週改BUG順利~

改bug

參考資料:

相關文章
相關標籤/搜索