vscode 支持Node.js

VS Code 的各種 JavaScript 功能，是通過 TypeScript 的編譯器來實現(xiàn)的，但是它并沒有局限JavaScript 代碼是前端項目還是后端項目，VS Code 對它們的語言支持都是一致的。不過，這里不得不提 VS Code 的 Node.js 調試器。它是 VS Code 里的第一個代碼調試器，可以說，VS Code 的代碼調試 API，Node.js 是支持得最好的。從這個角度看，Node.js 在 VS Code 項目的地位，可以跟 TypeScript 比肩了。

那么，我們就來看看，VS Code 里對于 Node.js 調試，有哪幾個有趣且實用的功能。

代碼調試 Auto Attach

第一個就是代碼調試（Auto Attach）了。在前面介紹 VS Code 的代碼調試功能時，我舉的第一個例子，就是打開一個 JavaScript 文件，以 Node.js 環(huán)境進行調試運行，然后又介紹了如何書寫 launch.json 來提供相對復雜的代碼調試配置。

其實，Node.js 調試器則更進一步。如果我們在 VS Code 的集成終端里以命令行的形式調試代碼的話，則可以無需 launch.json，直接將調試器掛載到運行的代碼上。

首先，我們將 index.js 代碼調整成 Node.js 支持的格式（請注意，這里我暫時不再引用 app.js 模塊，而是只使用 index.js 內的函數(shù)）：

// @ts-check

function foo() {
    bar("Hello World");
}

/**
 * bar
 * @param {string} str 
 */
function bar(str) {
    console.log(str);
}

foo()

JavaScript

然后打開命令面板，執(zhí)行 “切換開關自動附加” （Toggle Auto Attach）命令；

然后我們在 index.js 的第 15 行插入一個斷點。

最后，我們打開集成終端，輸入 Node.js 的調試命令：

node --inspect-brk index.js

JavaScript

可以看到 VS Code 立刻進入了調試模式，然后在第 15 行停了下來。

所以，如果你平時就是使用 JavaScript 直接寫 Node.js，相信這個命令肯定能給你省去很多調整 launch.json 的麻煩。

記錄點 Logpoints

下一個功能，叫做記錄點（Logpoints），這個看名字不太好理解呢。不過相信你在開發(fā) JavaScript 的過程中，肯定會經常在代碼中輸入 console.log() 來輸出變量值以便調試。即使現(xiàn)在編輯器和瀏覽器的調試功能都已經非常強大了，但是很多同學依然喜歡這種簡單的方式來調試代碼。

Node.js 調試的 Logpoints 功能，就是將 console.log 和斷點結合起來，把 console.log 要輸出的信息，通過類似于條件斷點的方式執(zhí)行并打印出來。具體操作是如何的呢？

首先我們在第 12 行行號前右擊，從上下文菜單里選擇“添加記錄點”，然后從左側的選擇列表里，選擇表達式。在輸入框里輸入我們想要輸出的內容并且用花括號包裹 { str + “!” }，按下回車。

接著，我們 F5 調試當前這個文件，選擇 Node.js 這個環(huán)境。由于我們其實并沒有真正創(chuàng)建斷點，所以代碼很快執(zhí)行結束。我們不妨打開調試面板看看。

我們能在調試面板里看到兩個輸出結果：

Hello World!        index.js:12
Hello World         index.js:12

第一條結果就來自記錄點 Logpoints，而第二條則是我們代碼中的 console.log(str)?？吹竭@里，相信你就明白這個功能的用途了，你可以將原本需要寫在代碼里的 console.log ，放到記錄點 Logpoints 中，一樣可以得到輸出結果，而且還不改變原有的代碼。