Wie man in WebStorm Gulp-Aufgaben, die in TypeScript geschrieben sind (gulpfile.ts), debuggt
Derzeit sieht es sehr einfach aus, Gulp-Aufgaben in WebStorm zu debuggen, wenn sie in JavaScript geschrieben sind. Man klickt einfach mit der rechten Maustaste auf die Gulp-Aufgabe im Gulp Tasks-Fenster und wählt Debug und voila :). Jetzt, da TypeScript häufig verwendet wird und nach der Installation von https://github.com/TypeStrong/ts-node, kann man seine Gulp-Aufgaben in TypeScript schreiben und man wird auch in der Lage sein, eine gulpfile.ts anstelle einer gulpfile.js zu erstellen.
Das Ausführen von Gulp-Aufgaben, die mit TypeScript geschrieben wurden, ist dasselbe wie zuvor gulp my.task und der eigentliche Code Ihrer Aufgabe befindet sich in my.task.ts. Was passieren wird, ist, dass dieses ts-node-Modul etwas Magie ausführt, wahrscheinlich die gulpfile.ts und alle dort registrierten Aufgaben im Speicher kompiliert, und sie dann irgendwie dem echten Gulp-Node-Modul bereitstellt.
Meine Frage ist, wie kann ich Breakpoints zu diesen Gulp *.ts-Dateien hinzufügen und sie über WebStorm debuggen?
Hier ist, was passiert, wenn ich versuche, eine mit TypeScript geschriebene Gulp-Aufgabe zu debuggen:
"C:\Program Files (x86)\JetBrains\WebStorm 2016.2.3\bin\runnerw.exe" "C:\Program Files (x86)\nodejs\node.exe" --debug-brk=64720 --expose_debug_as=v8debug E:\XXXXXXXX\node_modules\gulp\bin\gulp.js --color --gulpfile E:\XXXXXXXX\gulpfile.ts build.js.dev
Debugger listening on [::]:64720
[17:43:13] Requiring external module ts-node/register
Process finished with exit code -1073741510 (0xC000013A: interrupted by Ctrl+C)
Sie können ein Projekt finden, das TypeScript verwendet, um Gulp-Aufgaben zu schreiben, hier: https://github.com/mgechev/angular2-seed