vscode——如何调试typescript

最近在学习TS,为了方便研究下如何使用vscode进行调试,前提是您本地已经安装过typescript且可正常使用 tsc ;

debugging : https://code.visualstudio.com/docs/editor/debugging#_debug-actions
tasks : https://code.visualstudio.com/docs/editor/tasks#_typescript-hello-world

内容

配置tsconfig.json

根据自己的实际去配置即可

 {
    "compilerOptions": {
        "module": "system",
        "target": "ES2015",
        "strict": true,
        "outDir": "./dist",
        "outFile": "./dist/app.js",
        "sourceMap": true
        
    },
    "include": [
        "./src/**/*"
    ]
}
 

配置运行tasks.json

当然也可以在终端运行 tsc -w

 {
	"version": "2.0.0",
	"tasks": [
		{
			"type": "typescript",
			"tsconfig": "tsconfig.json",
			"option": "watch",
			"problemMatcher": [
				"$tsc-watch"
			],
			"group": "build",
			"label": "tsc: 监视 - tsconfig.json"
		}
	]
}
 

创建配置launch.json

 {
    // 使用 IntelliSense 了解相关属性。 
    // 悬停以查看现有属性的描述。
    // 欲了解更多信息，请访问: https://go.microsoft.com/fwlink/?linkid=830387
    "version": "0.2.0",
    "configurations": [
        {
            "type": "pwa-node",
            "request": "launch",
            "name": "Launch Program",
            "skipFiles": [
                "<node_internals>/**"
            ],
            // 对应tsconfig.json下的outFile
            "program": "${workspaceRoot}/dist/app.js"
        }
    ]
}
 

查看更多关于vscode——如何调试typescript的详细内容...