TypeScript
Debugowanie
Szukaj…
Wprowadzenie
Istnieją dwa sposoby uruchamiania i debugowania TypeScript:
Przełóż na JavaScript , uruchom w węźle i użyj odwzorowań, aby połączyć się z plikami źródłowymi TypeScript
lub
Uruchom TypeScript bezpośrednio za pomocą ts-node
W tym artykule opisano oba sposoby korzystania z programu Visual Studio Code i WebStorm . Wszystkie przykłady zakładają, że głównym plikiem jest plik index.ts .
JavaScript z SourceMaps w Visual Studio Code
W zestawie tsconfig.json
"sourceMap": true,
do generowania odwzorowań wraz z plikami js ze źródeł TypeScript za pomocą polecenia tsc
.
Plik launch.json :
{
"version": "0.2.0",
"configurations": [
{
"type": "node",
"request": "launch",
"name": "Launch Program",
"program": "${workspaceRoot}\\index.js",
"cwd": "${workspaceRoot}",
"outFiles": [],
"sourceMaps": true
}
]
}
To uruchamia węzeł z wygenerowanym plikiem index.js (jeśli twoim głównym plikiem jest index.ts) i debuggerem w programie Visual Studio Code, który zatrzymuje się w punktach przerwania i rozwiązuje wartości zmiennych w kodzie TypeScript.
JavaScript z SourceMaps w WebStorm
Utwórz konfigurację debugowania Node.js i użyj index.js
jako parametrów węzła .
TypeScript z ts-node w Visual Studio Code
Dodaj ts-node do swojego projektu TypeScript:
npm i ts-node
Dodaj skrypt do package.json
:
"start:debug": "ts-node --inspect=5858 --debug-brk --ignore false index.ts"
Plik launch.json
musi zostać skonfigurowany do używania typu node2 i uruchamiania npm z start:debug
skryptem start:debug
:
{
"version": "0.2.0",
"configurations": [
{
"type": "node2",
"request": "launch",
"name": "Launch Program",
"runtimeExecutable": "npm",
"windows": {
"runtimeExecutable": "npm.cmd"
},
"runtimeArgs": [
"run-script",
"start:debug"
],
"cwd": "${workspaceRoot}/server",
"outFiles": [],
"port": 5858,
"sourceMaps": true
}
]
}
TypeScript z ts-node w WebStorm
Dodaj ten skrypt do package.json
:
"start:idea": "ts-node %NODE_DEBUG_OPTION% --ignore false index.ts",
Kliknij skrypt prawym przyciskiem myszy i wybierz opcję Utwórz „test: pomysł” ... i potwierdź przyciskiem „OK”, aby utworzyć konfigurację debugowania:
Uruchom debugger za pomocą tej konfiguracji: