Integration der Microsoft Edge-IDE

Verschiedene Features von Microsoft-Tools ermöglichen die Integration der Entwicklung mithilfe von Microsoft Edge, Visual Studio Code und Visual Studio, um Ihre Produkte, Webseiten und Web-Apps zu entwickeln, die die vollständige Integration in Microsoft Edge verwenden und damit arbeiten.

Microsoft Edge DevTools-Erweiterung für Visual Studio Code

Mit der Microsoft Edge DevTools-Erweiterung für Visual Studio Code können Sie das Tool Elemente und das Netzwerktool des Microsoft Edge-Browsers in Visual Studio Code verwenden.

Ohne Visual Studio Code zu verlassen, verwenden Sie Microsoft Edge DevTools, um eine Instanz anzufügen oder eine Instanz von Microsoft Edge zu starten, und dann:

  • Zeigen Sie die HTML-Laufzeitstruktur an.
  • Ändern Sie das Webseitenlayout.
  • Ändern sie CSS-Formatvorlagen, und beheben Sie Formatierungsprobleme.
  • Lesen von Konsolennachrichten.
  • Anzeigen von Netzwerkanforderungen

Weitere Informationen finden Sie unter Microsoft Edge DevTools-Erweiterung für Visual Studio Code.

Öffnen von Quelldateien in Visual Studio Code

Das Open Source-Dateien in Visual Studio Code-Experiment ermöglicht es Ihnen, Microsoft Edge DevTools zu verwenden, aber dann Ihre Dateien in Visual Studio Code anstatt im Code-Editor des DevTools Sources-Tools zu bearbeiten.

Wenn Sie dieses Experiment verwenden und Visual Studio Code und DevTools verwenden, um Ihre CSS-Regeln zu ändern, müssen Sie nicht mehr den Code-Editor im Quellentool von DevTools verwenden. Sie können einfach den Code-Editor in Visual Studio Code verwenden. Wenn Sie dieses Experiment aktivieren, erhalten lokale Dateien eine andere Behandlung.

Weitere Informationen finden Sie unter Öffnen von Quelldateien in Visual Studio Code.

Debuggen von Microsoft Edge in Visual Studio Code

Visual Studio Code enthält einen integrierten Debugger für Microsoft Edge, der den Browser starten oder an einen bereits ausgeführten Browser anfügen kann.

Mit diesem integrierten Debugger können Sie Ihren Front-End-JavaScript-Code Zeile für Zeile debuggen und Anweisungen direkt aus Visual Studio Code anzeigen console.log() .

Weitere Informationen finden Sie unter Debuggen von Microsoft Edge in Visual Studio Code.

Die Webhint-Erweiterung für Visual Studio Code

Verwenden Sie webhint, ein anpassbares Lintingtool, um die Funktionalität Ihrer Website zu verbessern, einschließlich:

  • Barrierefreiheit.
  • Leistung.
  • Browserübergreifende Kompatibilität.
  • PWA-Kompatibilität.
  • Sicherheit.

webhint überprüft Ihren Code auf bewährte Methoden und häufige Fehler. Identifizieren und beheben Sie Probleme in Ihren Dateien, einschließlich HTML, CSS, JavaScript und TypeScript. Hinweise werden im Text-Editor als wellenförmige Unterstreichungen angezeigt und im Bereich Probleme zusammengefasst.

Hinweis: Ab April 2022 wird die Webhint-Erweiterung für Visual Studio Code nicht mehr beibehalten. Weitere Informationen finden Sie unter Microsoft Edge DevTools-Erweiterung für Visual Studio Code.

Visual Studio für die Webentwicklung

Microsoft Visual Studio ist eine integrierte Entwicklungsumgebung (IDE). Verwenden Sie es, um Ihre Web-Apps zu bearbeiten, zu debuggen, zu erstellen und zu veröffentlichen. Es handelt sich um ein funktionsreiches Programm, das für viele Aspekte Ihrer Webentwicklung verwendet werden kann.

Zusätzlich zum Standard-Editor und Debugger, die die meisten IDEs bereitstellen, enthält Visual Studio Features, die Ihren Entwicklungsprozess vereinfachen, einschließlich:

  • Compiler.
  • Code-Vervollständigungstools.
  • Grafische Designer.
  • Und viele weitere Features.

Weitere Informationen finden Sie unter Visual Studio für die Webentwicklung.