Microsoft Edge DevTools-Erweiterung für Visual Studio Code

[ebody]

Hallo,

um in VS Code direkt die DevTools, wie die Konsole nutzen zu können, habe ich diese Erweiterung installiert.

Wenn ich eine launch.json generieren möchte wird diese immer in dem Verzeichnis erstellt, welches im Workspace als erstes aufgelistet wird und nicht in dem, welches ich selektiert habe.

1. Wie kann ich die launch.json in dem gewünschten Verzeichnis erstellen?

Wenn ich "Launch instance" starte, öffnet sich eine Seite in VS Code, aber nicht die, die ich untersuchen will.

2. Wie kann ich die Seite öffnen, die ich untersuchen möchte?

Wenn ich "Run and Debug" starte…

...öffnet sich ein externes Browser fenster mit der URL http://localhost:8080/. Hier wird aber die Verbindung verweigert.

.

3. Wie kann ich hier die Seite öffnen, die ich untersuchen möchte?

Gruß ebody

[Der Martin]

Hi,

...öffnet sich ein externes Browser fenster mit der URL http://localhost:8080/. Hier wird aber die Verbindung verweigert.

lauscht denn dein Webserver auch wirklich auf Port 8080?

Einen schönen Tag noch
 Martin

[ebody]

Gute Frage. Ich weiß noch nicht mal, ob ein lokaler Webserver eingerichtet ist. Ich dachte, wenn die Erweiterung schon ein Browserfenster mit der URL öffnet, dass sie auch einen lokalen Webserver zur Verfügung stellt.

Wenn dem so ist, wo kann ich sehen auf welchen Pfad localhost zugreift u.a.?

Muss ich erst einen Server installieren und starten?

Ich hatte zuvor in einem anderen Verzeichnis http-server installiert. Jetzt wollte ich testen, ob ich den mit http-server D:\projekte\spielplatz\js\muster-oop\index.html starten kann, hier erscheint aber die Fehlermeldung:

http-server : Die Benennung "http-server" wurde nicht als Name eines Cmdlet, einer Funktion, einer Skriptdatei oder eines ausführbaren Programms erkannt. Überprüfen Sie die Schreibweise des Namens, oder ob der Pfad korrekt ist (sofern enthalten), und wiederholen Sie den Vorgang.

Ich blicke bei node.js einfach nicht durch.

Gruß ebody

[Der Martin]

Hallo,

eins vorweg: Im Detail kann ich dir vermutlich auch nicht weiterhelfen, weil ich weder mit VS Code, noch mit node.js je irgendwas angestellt habe.

Gute Frage. Ich weiß noch nicht mal, ob ein lokaler Webserver eingerichtet ist.

Wenn du http://localhost/ ansprechen willst, muss da ein Webserver laufen. Das muss nicht gleich ein Apache sein, vielleicht eher irgendwas kleines. Aber auf jeden Fall irgendein Programm, das HTTP-Requests beantwortet - also ein Webserver.

Ich habe nur so provokativ gefragt, weil der übliche Port für HTTP sonst eigentlich 80 ist.

Ich dachte, wenn die Erweiterung schon ein Browserfenster mit der URL öffnet, dass sie auch einen lokalen Webserver zur Verfügung stellt.

Könnte man glauben. Aber alles, was ich dazu jetzt sagen könnte, ist Spekulatius.

Wenn dem so ist, wo kann ich sehen auf welchen Pfad localhost zugreift u.a.?

Ich verstehe nicht ganz, was du damit meinst.

Muss ich erst einen Server installieren und starten?

Vielleicht bist du auch irgendwo komplett falsch abgebogen. In deinem ersten Post hatte ich den Eindruck, du willst mit node.js einen Browser "fernsteuern" und irgendwie automatisiert debuggen willst. Dazu brauchst du natürlich keinen Webserver, der läuft ja irgendwo da draußen.

Einen schönen Tag noch
 Martin

[Rolf B]

Hallo ebody,

vorweg: Die Debug-Erweiterung von VS Code habe ich noch nicht benutzt. Ich debugge immer mit den Browser-Entwicklertools. Ich kann nur generell was zu deinen Fragen sagen:

Ich hatte zuvor in einem anderen Verzeichnis http-server installiert

Hast Du es global installiert? Wenn ja, sollte es im PATH stehen und auffindbar sein. Die Anleitung sagt, so:

npm install --global http-server

Hast Du das nicht - was ich persönlich EMPFEHLEN würde, weil ich es hasse, eine PATH Variable zu haben, die ich ohne Scrollen nicht in ein CMD-Fenster bekomme - dann wirst Du vor dem Aufruf von http-server in dieses Verzeichnis wechseln müssen, oder den Installationspfad beim Aufruf hinzufügen. Zum Beispiel

D:\projekte\tools\httpserver\http-server D:\projekte\spielplatz\js\muster-oop

Beachte: OHNE index.html. Nur der Pfad. Der Dateiname kommt aus der URL.

Einen einfachen HTTP Server bekommst Du auch mit PHP -S, und für größere Aktivititäten kannst Du unter Windows auch den IIS aktivieren (Features hinzufügen), der hat eine graphische Verwaltungskonsole und man kann ihm sogar PHP mit FastCGI beibringen. IIS ist allerdings nichts, was man in 10 Minuten beherrscht und verfügt genau wie Apache über genügend Booby-Traps um sich damit in den Fuß zu schießen.

wo kann ich sehen auf welchen Pfad localhost zugreift

Einfach nur localhost - ohne Port-Angabe - dafür musst Du wissen, welches Programm auf 127.0.0.1:80 lauscht (oder ::1:80 bei IPv6) und dann in dessen Konfiguration schauen. Das ist nur nicht so einfach herauszufinden, denn in neueren Windowsversionen lauscht man indirekt über http.sys, weil dieser Treiber Port-Sharing ermöglicht. Analysetools, die hier alle Dienste herausfischen, kenne ich nicht.

Der Klassiker ist "netstat -ano", aber dann bekommst Du für Port 80 nur heraus, dass "System" darauf lauscht. Der Windows Kernel. Und http.sys ist ein Kernelmodus-Treiber. Du siehst also nur http.sys als Besitzer des Ports. Für HTTP musst Du ein anderes Tool bemühen:

Netsh http show servicestate >httpusers.txt

Ja, in eine Datei umleiten, bitte. Oder eine Konsole mit Scrollbar verwenden. Der Output ist GEWALTIG.

Der http-server, den Du erwähntest, lauscht per Default auf Port 8080, d.h. wenn Du damit spielen willst, musst Du http://localhost:8080/index.html als URL angeben. Und greifst dann auf den Ordner zu, den Du http-server beim Starten übergeben hast.

Rolf

[Raketenwilli]

Ich hatte zuvor in einem anderen Verzeichnis http-server installiert. Jetzt wollte ich testen, ob ich den mit http-server D:\projekte\spielplatz\js\muster-oop\index.html starten kann, hier erscheint aber die Fehlermeldung:

Na?

Also. Wieso erwartest Du, dass das geht?

Zu erst einmal hast Du Windows und versuchst ein Programm namens 'http-server' zu starten.

→ Windows (genauer: cmd.exe) scheitert daran, weil es weder im aktuellen Ordner noch im Suchpfad Programm namens 'http-server[.exe|.com|.bat|.cmd]' gibt.

Jetzt könntest Du versuchen, npm run http-server D:\projekte\spielplatz\js\muster-oop\index.html zu starten.

→ npm scheitert, weil es weder im aktellen Ordner noch in seinem Libdir ein Package namens http-server findet. Du hast das ja in einem anderen Ordner installiert.

Lösung:

Schritte:

1. Installiere wie von Rolf erwähnt den npm-http-server global
2. Lege Dir in einem leeren Verzeichnis eine package.json mit dem passenden Scriptlet an.
3. Wenn Du unterschiedliche Verzeichnisse „servieren“ willst, dann baue Dir eine Windows-Batch-Datei, welche die Package.json editiert und erst dann den http-Server startet, in dem diese in diesem Verzeichnis npm run %NAME_DEINES_SCRIPTLETS ausführt.

Alternativ kannst Du auch mit

npm set bar=foo;

eine Variable setzen und diese in der package json als %bar% benutzen. Diese werden nach $HOME→.npmrc geschrieben.

Ausgabe mit etwas wie

• npm get
• npm config ls -l (sic!)
• npm get bar

Übrigens hat npm ein Handbuch.