node.js調試入門

1-1 Inspector 介紹

git bash 經常使用命令

• mkdir test 新建文件夾
• cd test 進入文件夾
• cd ../ 進入父級文件夾
• ls 列出當前文件夾下的文件和文件夾
• code 當前目錄下的文件夾名 可經過vsCode自帶的一個全局變量code打開對應的項目

VS Code進行斷點調試

快捷鍵F5啓動一個websocket服務進行調試，會在調試控制檯打印：

D:\Program Files\nodejs\node.exe --inspect-brk=24775 app.js
Debugger listening on ws://127.0.0.1:24775/6cc7bcf1-c9fc-4f58-a819-2dd38e9fb9bf
For help, see: https://nodejs.org/en/docs/inspector

對應的 http 服務爲： http://127.0.0.1:24775 在後面加上 json 便可查看對應的元信息 http://127.0.0.1:24775/json

1-2 激活調試

node --inspect app.js 運行時添加 --inspect 便可激活調試

使用express搭建一個服務啓動調試

1. npm init 初始化一個包管理器並指定入口文件（app.js）
2. npm install express --save 安裝express模塊
3. 在入口文件app.js中書寫服務代碼

const express = require('express')
const app = express()

app.get('/', (req, res) => {
  res.send('hello world !')
})

app.listen('3000', () => {
  console.log('程序運行在3000端口')
})

1. node --inspect app.js 運行命令便可啓動調試

注意：須要設置VSCode，設置裏搜索attach，將 Debug › Node: Auto Attach 的值改成 on 便可

1-3~4 調試客戶端-chrome devtools

啓動調試客戶端

• 法一：

  1. chrome瀏覽器中輸入chrome://inspect
  2. 選擇 Devices
  3. 點擊 Configure... 配置好點 Done
  4. 而後點擊Target下的 inspect 便可
• 法二：
  直接在瀏覽器中訪問元信息中的 devtoolsFrontendUrl 也可打開
  查看元信息
• 法三：
  打開瀏覽器開發者工具，點擊左上角的綠色圖標進入
• 法四：
  使用 VSCode 的調試功能

1-5 調試客戶端 vscode

• 啓動方式：快捷鍵F5
• 配置：launch.json
• node 中打印參數列表：console.log(process.argv)

1-6 命令行參數介紹

• 官方文檔

本做品系原創 採用《署名-非商業性使用-禁止演繹4.0 國際》許可協議