Intégration de l’IDE Microsoft Edge

  • Article

Diverses fonctionnalités des outils Microsoft permettent d’intégrer le développement à l’aide de Microsoft Edge, Visual Studio Code et Visual Studio pour développer vos produits, pages web et applications web qui utilisent et fonctionnent avec l’intégration complète dans Microsoft Edge.

Extension Microsoft Edge DevTools pour Visual Studio Code

L’extension Microsoft Edge DevTools pour Visual Studio Code vous permet d’utiliser l’outil Éléments et l’outil Réseau du navigateur Microsoft Edge à partir de Visual Studio Code.

Sans quitter Visual Studio Code, utilisez Microsoft Edge DevTools pour l’attacher à une instance ou lancer une instance de Microsoft Edge, puis :

  • Afficher la structure HTML du runtime.
  • Modifier la disposition de la page web.
  • Modifier les styles CSS et résoudre les problèmes de style.
  • Lire les messages de console.
  • Afficher les demandes réseau.

Consultez Extension Microsoft Edge DevTools pour Visual Studio Code.

Fichiers open source dans Visual Studio Code

L’expérience Fichiers open source dans Visual Studio Code vous permet d’utiliser Microsoft Edge DevTools, mais de modifier vos fichiers dans Visual Studio Code plutôt que dans l’éditeur de code de l’outil Sources DevTools.

Lorsque vous utilisez cette expérience, si vous utilisez Visual Studio Code et que vous utilisez DevTools pour modifier vos règles CSS, vous n’avez plus besoin d’utiliser l’éditeur de code dans l’outil Sources de DevTools. Vous pouvez simplement utiliser l’éditeur de code dans Visual Studio Code. Lorsque vous activez cette expérience, les fichiers locaux reçoivent un traitement différent.

Consultez Ouverture de fichiers sources dans Visual Studio Code.

Déboguer Microsoft Edge dans Visual Studio Code

Visual Studio Code inclut un débogueur intégré pour Microsoft Edge, qui peut lancer le navigateur ou l’attacher à un navigateur déjà en cours d’exécution.

Ce débogueur intégré vous permet de déboguer votre code JavaScript front-end ligne par ligne et de voir console.log() les instructions directement à partir de Visual Studio Code.

Consultez Déboguer Microsoft Edge dans Visual Studio Code.

Extension webhint pour Visual Studio Code

Utilisez webhint, un outil de linting personnalisable, pour améliorer les fonctionnalités de votre site, notamment :

  • Accessibilité.
  • Performance.
  • Compatibilité entre navigateurs.
  • Compatibilité PWA.
  • Sécurité.

Webhint vérifie dans votre code les bonnes pratiques et les erreurs courantes. Identifiez et corrigez les problèmes dans vos fichiers, notamment HTML, CSS, JavaScript et TypeScript. Les indicateurs apparaissent sous forme de soulignements ondulés dans l’éditeur de texte et sont résumés dans le volet Problèmes .

Note: Depuis avril 2022, l’extension webhint pour Visual Studio Code n’est plus gérée. Consultez Extension Microsoft Edge DevTools pour Visual Studio Code.

Visual Studio pour le développement web

Microsoft Visual Studio est un environnement de développement intégré (IDE). Utilisez-le pour modifier, déboguer, générer et publier vos applications web. Il s’agit d’un programme riche en fonctionnalités qui peut être utilisé pour de nombreux aspects de votre développement web.

En plus de l’éditeur et du débogueur standard fournis par la plupart des IDE, Visual Studio inclut des fonctionnalités pour faciliter votre processus de développement, notamment :

  • Compilateurs.
  • Outils de saisie semi-automatique du code.
  • Concepteurs graphiques.
  • Et bien d’autres fonctionnalités.

Consultez Visual Studio pour le développement web.