TypeScript
Debuggen

Einführung

JavaScript mit SourceMaps in Visual Studio-Code

In der tsconfig.json eingestellt

"sourceMap": true,

um mit den js-Dateien Zuordnungen aus den TypeScript-Quellen mit dem Befehl tsc zu generieren.
Die Datei launch.json :

{
    "version": "0.2.0",
    "configurations": [
        {
            "type": "node",
            "request": "launch",
            "name": "Launch Program",
            "program": "${workspaceRoot}\\index.js",
            "cwd": "${workspaceRoot}",
            "outFiles": [],
            "sourceMaps": true
        }
    ]
}

Dies startet den Knoten mit der generierten Datei index.js (wenn Ihre Hauptdatei index.ts ist) und dem Debugger in Visual Studio Code, der Haltepunkte hält und Variablenwerte innerhalb Ihres TypeScript-Codes auflöst.

JavaScript mit SourceMaps in WebStorm

Erstellen Sie eine Node.js Debug - index.js Konfiguration und verwenden index.js als Knoten Parameter.

TypeScript mit TS-Knoten in Visual Studio-Code

Fügen Sie Ihrem TypeScript-Projekt ts-node hinzu:

npm i ts-node

Fügen Sie Ihrem package.json ein Skript package.json :

"start:debug": "ts-node --inspect=5858 --debug-brk --ignore false index.ts"

Die launch.json muss so konfiguriert sein, dass sie den node2- Typ verwendet und npm startet, um das start:debug Skript auszuführen :

{
    "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 mit TS-Knoten in WebStorm

Fügen Sie dieses package.json zu Ihrer package.json :

"start:idea": "ts-node %NODE_DEBUG_OPTION% --ignore false index.ts",

Klicken Sie mit der rechten Maustaste auf das Skript und wählen Sie Create 'test: idea' ... und bestätigen Sie mit 'OK', um die Debug-Konfiguration zu erstellen:

Starten Sie den Debugger mit dieser Konfiguration: