Vscode 调试ts代码
时间: 2024-10-11 21:09:44 浏览: 6
Visual Studio Code (VSCode) 是一款流行的开源代码编辑器,它支持调试 TypeScript 代码非常方便。以下是使用 VSCode 调试 TypeScript 的步骤:
1. 安装配置:首先确保已安装了 TypeScript 和 Node.js(如果项目依赖 Node)。然后,在VSCode中安装适用于TypeScript的调试插件,如 "ms-vscode.debugger-for-chrome" 或 "debugger-for-nodejs"。
2. 设置launch.json:在项目根目录下创建或打开 `launch.json` 文件,这是一个 JSON 配置文件,用于指定调试会话的配置。配置需要包括启动目标(web服务器、Node进程等)、断点设置以及环境变量。
```json
{
"version": "0.2.0",
"configurations": [
{
"type": "node", // 或者 "chrome" 如果你是在浏览器里调试
"request": "launch",
"name": "Debug TypeScript App",
"program": "${workspaceFolder}/dist/main.js", // 根据你的构建过程填写实际入口文件
"outFiles": [ "${workspaceFolder}/**/*.js" ], // 指定typescript编译后的js文件范围
"sourceMapPathOverrides": {
"webpack:///src/*": "${workspaceFolder}/*"
}
}
]
}
```
3. 启动调试:通过命令面板(快捷键 `Ctrl + ,` 或者 `Cmd + ,`)选择相应的配置,点击“Start Debugging”按钮开始调试。
4. 断点和查看:在代码中设置断点,当程序运行到断点处会暂停。你可以使用内置的调试工具检查变量值、堆栈跟踪等。
5. 调试控制:通过调试控制台可以设置条件断点、步进执行代码、单步调试等。