記錄一次vscode調試nodemon的報錯

最近在學習慕課網大前端的課程，其中在第五週1-9的課程裏面，使用vscode 調試時失敗了遇到了一個報錯。說實話遇到這個報錯，我是很想直接問問老師怎麼解決的，但是我也明白，僅憑這些報錯，老師很可能無法復現問題，很難僅憑代碼找到原因，所以只好嘗試自己解決。
考慮到這個報錯自己也處理了很久，而且確實有一兩個遭遇和我類似的問題，我覺得可以爲我們這些少數的人寫寫我的解決方案。

本文雖然主要想針對的就是同樣在學這個課程而言恰好遇到類似報錯的同學，但還是需要簡單介紹一下情況。
課程裏我們ES6編寫koa代碼，並使用nodemon來啓動項目。老師給出了一個使用vscode進行調試的方案，其launch.json是這樣的：

// launch.json
{
  // 使用 IntelliSense 瞭解相關屬性。
  // 懸停以查看現有屬性的描述。
  // 欲瞭解更多信息，請訪問: https://go.microsoft.com/fwlink/?linkid=830387
  "version": "0.2.0",
  "configurations": [
    {
      "type": "node",
      "request": "launch",
      "name": "nodemon",
      "runtimeExecutable": "${workspaceFolder}/node_modules/.bin/nodemon",
      "program": "${workspaceFolder}/src/index.js",
      "restart": true,
      "console": "integratedTerminal",
      "internalConsoleOptions": "neverOpen",
      "runtimeArgs": ["--exec","babel-node"]
    }
  ]
}

很不幸，我運行調試報了一個錯誤，有類似如下字樣：

Error: Requires Babel "^7.0.0-0", but was loaded with "6.26.0". 

# 我也看到慕課網有一個小夥伴報了類似的錯誤
Requires Babel "^7.0.0-0", but was loaded with "6.26.3"

通過排查，我發現這是因爲我全局安裝了[email protected]的包。
遇到類似問題的小夥伴可以通過以下原因查看自己全局安裝的包：

npm list -g --depth 0

你可能會看到你已經安裝過babel-node的包

解決方案：
解決方案有兩個，我先說第一個：
這個報錯的原因就在於調試代碼運行時，嘗試在全局裏面尋找babel-node的執行命令，而全局裏麪包的版本不對從而報錯。這時我們可以嘗試將這個包卸載了安裝正確的包。
如果卸載了不安裝，那麼由於缺了包，你會看到類似這樣的報錯：

'babel-node' 不是內部或外部命令，也不是可運行的程序
或批處理文件。

# 卸載舊的包
npm uninstall -g babel-node
# 安裝所需要的包
npm i -g @babel/node

這時運行調試仍然會有可能有報錯的，但我扔建議你先試着運行調試。 一來，如果你已經安裝了相關的依賴就不會報錯，二來這樣子你會更清楚後續我們爲什麼要這樣做。

事實上仍然有可能會報錯,這裏請仔細看看你的報錯，是不是有某行報錯提示你@babel/core找不到？是的，你還需要全局安裝@babel/core。**注意，我並不能100%確定你沒有其他缺失的包，但你可以仔細讀讀代碼，如果有類似的包沒有，可以用類似的方法安裝

npm i -g @babel/core

好的，這時你運行代碼，應該就可以正常的調試了。

說到這裏就引出了我的方案二：
我使用方案一實現後，覺得還是有一點不好，我不希望爲了這個項目而全局安裝依賴包，畢竟每個項目可能依賴的版本都不一樣，這樣不太好。在經過嘗試後，我發現是可以直接使用項目的babel-node的，只要修改一下launch.json

{
  // 使用 IntelliSense 瞭解相關屬性。
  // 懸停以查看現有屬性的描述。
  // 欲瞭解更多信息，請訪問: https://go.microsoft.com/fwlink/?linkid=830387
  "version": "0.2.0",
  "configurations": [
    {
      "type": "node",
      "request": "launch",
      "name": "nodemon",
      "runtimeExecutable": "${workspaceFolder}/node_modules/.bin/nodemon",
      "program": "${workspaceFolder}/src/index.js",
      "restart": true,
      "console": "integratedTerminal",
      "internalConsoleOptions": "neverOpen",
      "runtimeArgs": ["--exec","${workspaceFolder}/node_modules/.bin/babel-node"]
    }
  ]
}

爲了驗證，我特意將剛剛全局安裝的@babel/node和@babel/core包又使用
代碼卸載了。（當然朋友你可以不卸載）直接運行調試就可以了

# 注意這裏是卸載剛安裝的包，只是爲了驗證，你完全沒有必要卸載，除非你也想親自驗證一下
npm uninstall -g @babel/node
npm uninstall -g @babel/core

最後

爲什麼有了第二個方案我還要介紹第一個方案呢？因爲第一個方案是最自然的，從報錯你自然引出的是第一個方案，直接拋出第二個方案，可能跨度太大了，同學會覺得莫名其妙。
第二個方案說白了是從第一個方案引申出的改良。