launch.json是什么

• 顧名思義：它是在.vscode文件夾下的launch.json，所以是vscode啟動調試的配置文件。
• 總結：通過定義調試參數、環境變量和啟動方式，幫助開發者快速啟動和調試代碼。

作用

• 簡化調試流程：通過預設參數（如啟動文件、命令行參數、環境變量等），避免每次調試時手動輸入重復命令。
• 支持多環境調試：可同時配置多個調試方案，一鍵切換不同場景。

多環境調試簡單實例

• 假設現在你要寫一個工具，需要用到多種語言（node.js、python等）
• 每個單獨的nodejs/py文件運行都需要在命令行/terminal輸入一下調用的命令及文件名（很麻煩）
• 為了簡化運行，配置如下launch.json：

{"version": "0.2.0","configurations": [{"type": "node","request": "launch","name": "調試extracted.js","skipFiles": ["<node_internals>/**"],"program": "${workspaceFolder}\\tool_chinese_strings_extracted.js"},{"type": "node","request": "launch","name": "調試log.js","skipFiles": ["<node_internals>/**"],"program": "${workspaceFolder}\\tool_log.js"},{"type": "node","request": "launch","name": "調試testBp.js","skipFiles": ["<node_internals>/**"],"program": "${workspaceFolder}\\testBp.js"},{"name": "調試py_replace","type": "debugpy","request": "launch","program": "${workspaceFolder}\\tool_replacer.py",},{"name": "調試py_genxls","type": "debugpy","request": "launch","program": "${workspaceFolder}\\tool_excel_generator.py",},{"name": "調試py_notepad","type": "debugpy","request": "launch","program": "${workspaceFolder}\\tool_log.py",}]
}

• 得到快捷F5執行列表：
  
• 這樣就很方便（以上是簡單的示例）。

進階使用

核心配置項解析

{// 使用 IntelliSense 了解相關屬性。 // 懸停以查看現有屬性的描述。// 欲了解更多信息，請訪問: https://go.microsoft.com/fwlink/?linkid=830387"version": "0.2.0","configurations": [{"name": "Python: 當前文件", //調試方案的名稱（顯示在調試下拉菜單中）"type": "python", //調試器類型（如 python、node、cppdbg、chrome、debugpy等）//調試啟動方式，常用 launch（啟動新進程）或 attach（附加到已有進程）"request": "launch", //調試啟動方式// （${file} 表示當前打開的文件）    ${workspaceFolder} 表示項目根目錄"program": "${file}", //要運行的程序入口文件//指定要調試的入口文件（例如 HTML 文件）。在瀏覽器調試場景中，替代 program 字段。             "file": "${workspaceRoot}/bin/index.html",//控制臺類型（如 integratedTerminal 使用VSCode內置終端）"console": "integratedTerminal", "args": ["--input", "data.txt"], //傳遞給程序的命令行參數"env": {"DEBUG_MODE": "true"} //設置環境變量// 以下可選參數// 默認使用系統默認瀏覽器，但可通過此字段自定義（如："C:/chrome.exe"）"runtimeExecutable": "chrome" //"${execPath}" //${execPath} 表示 VS Code 的安裝路徑// 啟用源映射（Source Maps），將壓縮/編譯后的代碼映射回原始源代碼，便于調試。"sourceMaps": true // (適用于 TypeScript、Babel 等轉譯場景。// 定義 Web 服務器的根目錄路徑，幫助調試器定位源代碼文件（尤其是與源映射配合時）。"webRoot": "${workspaceRoot}" //表示項目根目錄為 Web 根目錄。"port": 8090 //指定調試會話使用的端口號（默認由調試器自動分配）。// 向瀏覽器運行時傳遞命令行參數，用于控制瀏覽器行為（例如禁用安全策略、啟用文件訪問）"runtimeArgs": ["--allow-file-access-from-files", //允許通過 file:// 協議訪問本地文件。"--disable-web-security" //禁用瀏覽器同源策略（開發時常用，但需謹慎）。]//指定 Chrome 瀏覽器的用戶數據目錄。//通過隔離用戶數據（如緩存、歷史記錄），避免調試會話影響日常瀏覽器使用。"userDataDir": "${workspaceRoot}/.laya/chrome" //將用戶數據存儲在項目目錄下的 .laya/chrome 文件夾中。//覆蓋源映射（Source Maps）中的路徑，解決編譯后路徑與本地路徑不一致的問題。"sourceMapPathOverrides": { //將編譯后代碼中的 src/ 路徑映射到本地項目的 src/ 目錄。"src/": "${workspaceRoot}/src/"}// 指定調試時要跳過的文件或目錄，避免進入無關代碼（如Node.js內部模塊或第三方庫）//讓調試過程聚焦于用戶自己的代碼。//<node_internals> 是VSCode預定義的路徑別名，表示Node.js的核心模塊（如fs、path等）。//  /** 表示跳過所有子目錄和文件。調試時，單步調試（如F10）會直接跳過這些文件，不會進入其內部。"skipFiles": ["<node_internals>/**"]"skipFiles": [ //這會同時跳過Node核心模塊和項目的node_modules目錄"<node_internals>/**","${workspaceFolder}/node_modules/**"]}]
}

調試第三方程序

• 通過 “preLaunchTask” 和 “postDebugTask” 配置調試前后自動執行的任務（需配合 tasks.json 使用）。
• 簡單實例：

// 創建 tasks.json（在 .vscode 文件夾下）
{"version": "2.0.0","tasks": [{"label": "安裝依賴",       // 任務名稱（在 launch.json 中引用）"type": "shell",         // 任務類型（執行shell命令）"command": "npm install",// 調試前自動安裝依賴"problemMatcher": []},{"label": "清理臨時文件","type": "shell","command": "rm -rf ./tmp/*", // 調試后清理臨時文件（Windows 可用 `del .\\tmp\\*`）"problemMatcher": []}]
}

//launch.json（通過tasks的label關聯任務）
{"version": "0.2.0","configurations": [{"name": "啟動調試","type": "node","request": "launch","program": "${workspaceFolder}/app.js",//調試啟動前必須完成的任務（若任務失敗，調試不會啟動）。"preLaunchTask": "安裝依賴",   // 調試前自動執行的任務名稱 // 調試結束后自動觸發的任務（無論調試成功或失敗）。"postDebugTask": "清理臨時文件" // 調試后自動執行的任務名稱}]
}

• 執行流程說明：
  1.啟動調試（按 F5）時：
  – 先執行 preLaunchTask → 運行 npm install 安裝依賴。
  – 依賴安裝成功后，啟動調試（運行 app.js）。
  2.結束調試 后：
  – 自動執行 postDebugTask → 清理 ./tmp 目錄下的臨時文件。