首先, 本人对于怎么调试一头雾水, 仅在此记录根据在网上搜索的结果, 结合自己实践, 得出的一种可行的方式.
第一步: 安装typescript, ts-node, tsconfig-paths三个包
npm install typescript ts-node tsconfig-paths --save-dev
第二步: 点击vscode上的调试按钮
QQ浏览器截图20200430234839.png
第三步: 如果之前未配置过, 则此处可能会有"创建launch.json文件"的内容, 点击后会在项目目录下生产.vscode文件夹, 文件夹内自动创建launch.json文件.
QQ浏览器截图20200430235131.png
第四步: 修改launch.json文件
QQ浏览器截图20200430235353.png
第五步: 在文件需要调试的地方打上断点, 然后点击上面图中的"运行"按钮, 运行程序开始调试.
下面, 列举一些launch.json配置中可能用到的预定义变量及含义
| 变量 | 含义 |
|---|---|
| ${workspaceFolder} | 当前工作目录(根目录) |
| ${workspaceFolderBasename} | 当前文件的父目录 |
| ${file} | 当前打开的文件名(完整路径) |
| ${relativeFile} | 当前根目录到当前打开文件的相对路径(包括文件名) |
| ${relativeFileDirname} | 当前根目录到当前打开文件的相对路径(不包括文件名) |
| ${fileBasename} | 当前打开的文件名(包括扩展名) |
| ${fileBasenameNoExtension} | 当前打开的文件名(不包括扩展名) |
| ${fileDirname} | 当前打开文件的目录 |
| ${fileExtname} | 当前打开文件的扩展名 |
| ${cwd} | 启动时task工作的目录 |
| ${lineNumber} | 当前激活文件所选行 |
| ${selectedText} | 当前激活文件中所选择的文本 |
| ${execPath} | vscode执行文件所在的目录 |
| ${defaultBuildTask} | 默认编译任务(build task)的名字 |
| ... | ... |
Tips: vscode的智能提示会在launch.json里提示所有支持的预定义变量.
网友评论