Hinweis
Für den Zugriff auf diese Seite ist eine Autorisierung erforderlich. Sie können versuchen, sich anzumelden oder das Verzeichnis zu wechseln.
Für den Zugriff auf diese Seite ist eine Autorisierung erforderlich. Sie können versuchen, das Verzeichnis zu wechseln.
Dies sind die neuesten DevTools-Features in der stabilen Version von Microsoft Edge.
Video: Microsoft Edge | Neuigkeiten in DevTools 96
Neue DevTools-Benutzeroberfläche verfügbar (in der Vorschau)
Das Microsoft Edge DevTools-Team experimentiert mit einer neuen DevTools-Benutzeroberfläche: Fokusmodus. Der Fokusmodus reduziert Ablenkungen und Unordnung mit einem moderneren und vereinfachten Layout. Mit der neuen Aktivitätsleiste können Sie Ihre bevorzugten Tools in einer horizontalen oder vertikalen Symbolleiste anheften, um den Platz auf dem Bildschirm effizienter zu nutzen.
Aktualisierung: Die vertikale Aktivitätsleiste wird in Microsoft Edge 144 und höheren Versionen nicht mehr unterstützt.
Um diese neue Benutzeroberfläche in Microsoft Edge Version 96 auszuprobieren, wählen Sie Einstellungen (
) >Experimente>Fokusmodus.
Ab Microsoft Edge Version 96 wird das Kontrollkästchen des Experiments mit der Bezeichnung Fokusmodus und nicht mit Fokusmodus und DevTools-QuickInfos bezeichnet.
Diese Benutzeroberfläche befindet sich noch in der Entwicklung und kann sich in zukünftigen Versionen von Microsoft Edge ändern. Wir sind gespannt auf Ihr Feedback zu dieser neuen DevTools-Benutzeroberfläche. Senden Sie uns Ihr Feedback, indem Sie @EdgeDevTools twittern. Oder wählen Sie bei aktiviertem Experiment "Fokusmodus" unten in der Aktivitätsleiste "Hilfe" (
) "Feedback" aus, um das Fenster "Feedback senden" > anzuzeigen.
Siehe auch:
-
DevTools: Benutzeroberfläche für den
MSEdgeExplainersFokusmodus im Repository.
Konsole kann wieder im oberen und unteren Bereich angezeigt werden
Seit Microsoft Edge Version 87 können Sie jedes Tool zwischen dem oberen und unteren Bereich verschieben, einschließlich des Konsolentools. Allerdings haben wir von Entwicklern gehört, dass das wiederholte Verschieben des Konsolentools umständlich war. Ab Microsoft Edge Version 96 wurde die Standarderfahrung für das Konsolentool wiederhergestellt, sodass Sie schnell zwischen einer Vollbildansicht der Konsole (im oberen Bereich) und einer geteilten Bildschirmansicht (mit der Konsole im unteren Bereich) wechseln können, ohne das Konsolentool zu bewegen.
Die Konsole kann in der Schublade (jetzt Schnellansicht) am unteren Rand von DevTools neben einem anderen Tool geöffnet werden:
Wenn Konsole im oberen Bereich ausgewählt ist, wird der untere Bereich automatisch minimiert, wenn im unteren Bereich die Konsole angezeigt wurde:
Wenn Sie das Konsolentool nur an einem einzigen Ort öffnen lassen möchten, können Sie das Verhalten der Konsole konfigurieren:
Klicken Sie in der Hauptsymbolleiste oder der Schubladensymbolleiste mit der rechten Maustaste auf die Registerkarte Konsole , und wählen Sie dann Konsole konfigurieren aus. Die Seite "Einstellungen>" wird angezeigt.
Deaktivieren Sie im Abschnitt Konsole das Kontrollkästchen Registerkarte Konsole im Hauptbereich und in der Schublade anzeigen, und klicken Sie dann auf Schließen (x).
Siehe auch:
- Tools für die Aktivitätsleiste im Vergleich zu Tools für die Schnellansicht in Info zur Liste der Tools
- Verschieben von Tools zwischen dem oberen und unteren Bereich in Neuigkeiten in DevTools (Microsoft Edge 87).
Microsoft Edge DevTools Visual Studio Code-Erweiterung
Weitere Informationen zu dieser Erweiterung finden Sie unter Microsoft Edge DevTools-Erweiterung für Visual Studio Code.
Zeigen Sie Ihr Webprojekt im Editor an und simulieren Sie verschiedene Geräte
Die Microsoft Edge DevTools für Visual Studio Code-Erweiterung bietet jetzt einen andockbaren Screencast und eine Geräteemulation:
Sie können Ihr Webprojekt in einer speziellen Registerkarte in Visual Studio Code sehen und auch verschiedene Geräte simulieren:
Ausführliche Informationen zur Geräteemulation finden Sie unter Geräte- und Statusemulation.
Live-Inline-Problemberichterstattung
Die Erweiterung bietet jetzt auch Live-Inline-Problemberichte. Anstatt sich in einem separaten Tool über Probleme zu informieren, hebt Visual Studio Code die Probleme in Ihrem Quellcode hervor und meldet sie live, während Sie Ihren Code eingeben:
Weitere Informationen finden Sie unter Inline- und Liveproblemanalyse.
Das Tool "Quellen" benachrichtigt Sie jetzt, wenn Sourcemaps nicht geladen werden können
In Microsoft Edge Version 96 stellt das Quellentool nun mehrere Hinweise auf der Benutzeroberfläche bereit, wenn DevTools Ihre Sourcemaps nicht laden kann. Auf der Registerkarte Seite im Bereich "Navigator " im Tool "Quellen " weisen Dateien, für die DevTools keine Sourcemaps laden kann, ein Warnsymbol anstelle des Dateisymbols auf.
Wenn Sie eine Datei mit dem Warnsymbol auswählen, wird die Datei im Tool "Quellen" mit einer Infoleiste geöffnet, die angibt, dass DevTools die Sourcemap entweder nicht korrekt vom Server abrufen oder die Sourcemap nicht richtig analysieren konnte:
In der Infoleiste können Sie mehr über das Problem erfahren, indem Sie die Schaltfläche In Problemen öffnen auswählen. Das Problemtool wird dann in der Schublade (jetzt Schnellansichtsbereich) unten in DevTools geöffnet und enthält Informationen zum Beheben des Problems und zum ordnungsgemäßen Laden Ihrer Sourcemap in DevTools:
Um zu verhindern, dass die Infoleiste über Sourcemaps das Quellenwerkzeug überfrachtet, wählen Sie die Schaltfläche Nicht mehr anzeigen . Um zu verhindern, dass Probleme im Zusammenhang mit Sourcemaps das Probleme-Tool überladen, deaktivieren Sie das Kontrollkästchen "Drittanbieter-Probleme einschließen " im Probleme-Tool .
Siehe auch:
Das Öffnen von Quelldateien in Visual Studio Code lässt sich jetzt besser in das Tool "Quellen" integrieren
In früheren Versionen von Microsoft Edge hatte das Aktivieren des Experiments "Quelldateien in Visual Studio Code öffnen " ein unerwartetes Verhalten, wenn Sie bereits das Quellentool in DevTools verwendet hatten. Wenn Sie Haltepunkte festlegen, gelangen Sie zu Visual Studio Code oder zur Dokumentation, um das Experiment richtig zu konfigurieren.
In Microsoft Edge Version 96 lässt sich das Experiment "Quelldateien in Visual Studio Code öffnen " jetzt besser in das Tool "Quellen " integrieren.
Wenn das Tool "Quellen" geöffnet ist und Sie dann das Experiment "Quelldateien in Visual Studio Code öffnen " aktivieren, wird durch das Festlegen von Haltepunkten oder das Öffnen von Dateien jetzt das Tool "Quellen" geöffnet, anstatt Sie zu Visual Studio Code oder zur Dokumentation zu leiten, um das Experiment richtig zu konfigurieren.
Wie bei früheren Versionen von Microsoft Edge gilt Folgendes: Wenn das Tool "Quellen " nicht in DevTools geöffnet ist und Sie dann das Experiment "Quelldateien in Visual Studio Code öffnen " aktivieren, wird die Datei durch das Festlegen von Haltepunkten oder das Öffnen von Dateien mit anderen Tools als dem Tool "Quellen " in Visual Studio Code geöffnet.
Siehe auch:
- Öffnen von Quelldateien in Visual Studio Code – Integration von DevTools in Visual Studio Code.
Durch Auswahl des Dropdowndreiecksymbols in der DevTools-Benutzeroberfläche wird nun das Menü geöffnet.
In früheren Versionen der Microsoft Edge DevTools wurde bei Auswahl des Dreieck-Symbols neben einem Dropdownmenü das Dropdownmenü nicht angezeigt. Um das Dropdown-Menü zu öffnen, müssen Sie auf den aktuell ausgewählten Menüpunkt links neben dem Dreieckssymbol klicken, z. B. Keine Drosselung:
In Microsoft Edge Version 96 wurde dieses Problem behoben. Wenn Sie das Dreieckssymbol für ein beliebiges Dropdownmenü in DevTools auswählen, wird jetzt das Dropdownmenü geöffnet:
Hinweis
Teile dieser Seite sind Änderungen, die auf von Google erstellten und freigegebenen Werken basieren und gemäß den in der Creative Commons Attribution 4.0 International License beschriebenen Begriffen verwendet werden. Die ursprüngliche Seite für Ankündigungen aus dem Chromium-Projekt ist What's New in DevTools (Chrome 96) und wurde von Jecelyn Yeen verfasst.
Diese Arbeit ist lizenziert unter einer Creative Commons Attribution 4.0 International License.