Gibt es eine Möglichkeit, die TypeScript-Quelle in Visual Studio zu debuggen (anstatt das generierte Javascript zu debuggen)?
Aus den TypeScript-Sprachspezifikationen:
TypeScript bietet optional Quellzuordnungen, die das Debuggen auf Quellenebene ermöglichen.
Ich hatte daher erwartet, Haltepunkte in ts-Code setzen und debuggen zu können, aber es funktioniert nicht. Ich habe keine anderen Erwähnungen zum Debuggen in den Spezifikationen gefunden. Gibt es etwas, was ich tun sollte, damit dies funktioniert? Vielleicht deutet das Wort "optional" darauf hin, dass ich etwas tun muss, damit es funktioniert ... Irgendwelche Vorschläge?
Antworten:
Aktuelle Antwort für VS2017 und höher
Das Debuggen von Typescript direkt in Visual Studio ist seit VS2017 möglich. Aus der Dokumentation :
Es gibt auch zusätzliche Ressourcen zum Debuggen von Typescript / Asp.NET Core in Visual Studio .
Es ist auch möglich, Typoskript in Visual Studio Code zu debuggen :
Ursprüngliche Antwort für frühere Versionen von VS:
Möglicherweise können Sie in VS nicht debuggen, in einigen Browsern jedoch. Aaron Powell hat gerade heute über das Funktionieren von Haltepunkten in Chrome Canary gebloggt: https://www.aaron-powell.com/posts/2012-10-03-typescript-source-maps/ .
Um (sehr kurz) zusammenzufassen, was Aaron sagt, verwenden Sie den
-sourcemap
Schalter am Compiler, um eine*.js.map
Datei im selben Verzeichnis wie Ihre Quelle zu generieren . In Browser , die Unterstützung Quelle Karten (Chrome Canary und vermutlich letzten Firefox baut, da sie eine Mozilla Idee sind), können Sie dann debuggen Ihre.ts
Quelle nur wie normale.js
Dateien.Der Blog endet mit "Hoffentlich greifen entweder das Visual Studio- oder das IE-Team (oder beide) auch Quellkarten zu und fügen Unterstützung für sie hinzu." - was darauf hindeutet, dass es noch nicht passiert ist.
Aktualisieren:
Mit der Veröffentlichung von TypeScript 0.8.1 ist das Debuggen von Quellkarten jetzt auch in Visual Studio verfügbar:
https://blogs.msdn.com/b/typescript/archive/2012/11/15/announcing-typescript-0-8-1.aspx
Aus der Ankündigung:
Update :
WebStorm hat auch Unterstützung für das Debuggen über SourceMaps hinzugefügt: http://blog.jetbrains.com/webide/2013/03/webstorm-6-0-released-adds-typescript-debugging-with-source-maps-fresh-ui- und vieles mehr/
quelle
Mit der VS2013 Typescript-Anwendung musste ich nichts in web.config ändern. Ich habe einen Haltepunkt in die ts-Datei eingefügt und im IE debuggt. Presto, der Haltepunkt wurde in TypeScript gestoppt.
quelle
Dies ist jetzt in VS 2017 behoben, sodass Sie direkt in Visual Studio und Typoskript debuggen können.
Setzen Sie einfach Ihren Haltepunkt in Ihre * .ts-Datei, und es wird getroffen.
Und es wird in VS debuggen, nicht in IE, als ob Sie c # debuggen würden.
quelle
Das Debuggen von Typoskript mit Visual Studio funktioniert mit den richtigen Einstellungen. (In früheren Versionen von VS habe ich manchmal Probleme. Im Folgenden wird beschrieben, wie es mit VS 2015 CTP 6 funktioniert.)
Zuerst stellen Sie sicher, dass Sie Quellzuordnungen erstellen, wenn Sie Typoskript in Javascript kompilieren. Sie sollten also eine xxx.js.map-Datei in der Nähe jeder xxx.js haben.
Das Abrufen von Quellzuordnungen durch Ausführen des Typoskript-Compilers außerhalb von Visual Studio verursacht keine Probleme, wenn Sie in der tsc-Befehlszeile hinzufügen
Ihr gulp-Skript erstellt normalerweise standardmäßig Quellkarten.
Konfigurieren Sie Ihre Webanwendung in Visual Studio .
Stellen Sie Internet Explorer als Startbrowser ein. Ich habe es nur mit IE zum Laufen gebracht und glaube nicht, dass irgendein anderer Browser funktionieren wird.
Gehen Sie in den Projekteigenschaften zur Registerkarte "Web" und konfigurieren Sie den Abschnitt "Debugger" unten: Deaktivieren Sie alle Debugger ! Dies ist nicht intuitiv und möglicherweise wird folgende Fehlermeldung angezeigt:
Sie haben versucht, den Debugger zu starten, aber basierend auf Ihren aktuellen Debug-Einstellungen auf der Seite mit den Web-Eigenschaften gibt es keinen Prozess zum Debuggen. Dies tritt auf, wenn die Option "Keine Seite öffnen. Auf eine Anforderung von einem anderen Prozess warten" ausgewählt ist und das ASP.NET-Debugging deaktiviert ist. Bitte überprüfen Sie Ihre Einstellungen auf der Seite mit den Web-Eigenschaften und versuchen Sie es erneut.
Wie in der Fehlermeldung angegeben, sollte die Startaktion oben in den Web-Eigenschaften eine weitere Option sein, z. B. " Aktuelle Seite ".
Setzen Sie jetzt oder später in Visual Studio Haltepunkte in Ihrem ts-Code.
Drücken Sie F5
Während Sie den Visual Studio-Editor zum Debuggen und Bearbeiten von ts-Dateien verwenden können, funktioniert "Bearbeiten und Fortfahren" nicht. Derzeit gibt es jedoch keinen Browser, der js- und js.map-Dateien neu laden und fortfahren kann. (Korrigieren Sie mich, wenn ich falsch liege und ich glücklich sein werde.)
quelle
Das TypeScript-Debugging funktionierte mit VS2013 Update 3 auf keinem meiner Computer. Nach langem Frust entschied ich mich für ein Update auf VS2013 Update 4 CTP. Endlich werden Haltepunkte in VS erreicht!
quelle
kurze Antwort: Starten Sie Visual Studio neu
Hintergrund: Ich hatte 2 Visual Studio 2015-Instanzen mit zwei verschiedenen Projekten mit TypeScript. Die erste gestartete Instanz hat nicht richtig debuggt, die zweite. Alle Projekteinstellungen waren gleich. Ich habe endlich die erste Instanz neu gestartet und dann TypeScript (endlich) debuggt.
quelle