Clonez et utilisez un référentiel GitHub dans Visual Studio Code

Découvrez les étapes permettant de cloner un référentiel public à partir de GitHub sur votre ordinateur local à l’aide de Visual Studio Code.

Ouvrez votre dépôt distant

Ouvrez votre dépôt distant sur votre ordinateur local.

Barre d’activité

1. Installer l’extension de référentiel distant
2. Sélectionnez l’indicateur distant en bas à gauche de Visual Studio Code.
3. Suivez les invites.

Barre d’état

Cette action n’est pas disponible à partir de cette fonctionnalité. Sélectionnez un autre onglet.

Palette de commandes

1. Ouvrez la palette de commandes avec la combinaison de touches Ctrl + Maj + P.
2. À l’invite de palettes de commandes, entrezgitcl, sélectionnez la commande Git : Cloner, puis sélectionnez Cloner à partir de GitHub, puis appuyez sur Entrée.
3. Quand vous êtes invité à fournir l’URL du dépôt, sélectionnez Cloner depuis GitHub, puis appuyez sur Entrée.
4. Si vous êtes invité à vous connecter à GitHub, terminez le processus de connexion.
5. Entrez azure-samples/js-e2e-express-server dans le champ URL du dépôt.
6. Sélectionnez (ou créez) le répertoire local dans lequel vous souhaitez cloner le projet, puis sélectionnez Sélectionner comme destination du dépôt.
7. Quand vous recevez la notification vous demandant si vous voulez ouvrir le dépôt cloné, sélectionnez Ouvrir.

Terminal intégré

1. Ouvrez un terminal intégré à partir du terminal -> Nouveau terminal.

2. Clonez votre dépôt avec la commande git suivante :

   git clone https://github.com/YOUR-NAME-OR-ORGANIZATION/YOUR-REPO-NAME
   

3. Ouvrez dans Visual Studio Code :

   code YOUR-REPO-NAME
   

Visual Studio Code utilise l’authentification Git fournie par le système d’exploitation (par exemple, le trousseau macOS ou le gestionnaire d’informations d’identification Windows) avec n’importe quelle fonctionnalité Git. La sortie est visible dans la palette > de commandes Git : afficher la sortie Git.

Ouvrir votre référentiel local

Si vous disposez d’un référentiel existant sur votre ordinateur local et souhaitez l’ouvrir dans Visual Studio Code, ouvrez simplement le dossier. Visual Studio Code reconnaît le .git sous-dossier et affiche les informations pertinentes.

Barre d’activité

1. Sélectionnez Ctrl + K + O.
2. Sélectionnez le dossier .

Barre d’état

Cette action n’est pas disponible à partir de cette fonctionnalité. Sélectionnez un autre onglet.

Palette de commandes

1. Ouvrez la palette de commandes avec la combinaison de touches Ctrl + Maj + P.
2. Filtrez avec Git, puis sélectionnez Open repository.
3. Sélectionnez le dossier à sélectionner comme racine du référentiel.

Terminal intégré

1. Ouvrez un terminal intégré à partir du terminal -> Nouveau terminal.

2. Ouvrez une nouvelle instance de Visual Studio Code pour le répertoire du référentiel :

   code ../dir1/dir2/my-repo
   

Initialiser un nouveau référentiel

Utilisez la procédure suivante pour créer un référentiel de code source local avec git.

Barre d’activité

1. Sélectionnez le contrôle de code source dans la barre d’activité ou utilisez la combinaison de touches Ctrl + Maj + G.

2. Sélectionnez Initialiser le référentiel.

   

Barre d’état

Cette action n’est pas disponible à partir de cette fonctionnalité. Sélectionnez un autre onglet.

Palette de commandes

1. Ouvrez la palette de commandes avec la combinaison de touches Ctrl + Maj + P.
2. Filtrez avec Git, puis sélectionnez Initialize repository.
3. Sélectionnez le dossier à sélectionner comme racine du référentiel.

Terminal intégré

1. Ouvrez un terminal intégré à partir du terminal -> Nouveau terminal.

2. Initialisez votre dossier avec git avec la commande git suivante :

   git init
   

Une fois le dépôt initialisé, créez le référentiel sur GitHub. Ajoutez ensuite ce référentiel en tant que distant à votre projet local à partir de la palette de commandes : recherchez Git: Add remote.

Créer une branche pour les modifications

Créez une branche pour capturer les modifications et isoler du principal ou du branche par défaut.

Barre d’activité

1. Sélectionnez le contrôle de code source dans la barre d’activité.
2. Sélectionnez les points de suspension (...) en regard du contrôle de code source.
3. Sélectionnez Branche ->Créer une branche.

Barre d’état

1. Sélectionnez le nom de la branche dans la barre d’état. La palette de commandes s’ouvre.

   La barre d’état se trouve en bas de Visual Studio Code.

2. Dans la palette de commandes, sélectionnez +Créer une branche.

3. Entrez le nom de votre nouvelle branche.

4. Entrez un nouveau nom de branche. Le nom de la branche est visible dans la barre d’état.

   

Palette de commandes

1. Ouvrez la palette de commandes avec la combinaison de touches Ctrl + Maj + P.

2. Recherchez git branch et sélectionnez Git: Create Branch.

   

3. Entrez un nouveau nom de branche, tel que test.

4. Le nom de la branche est visible dans la barre d’état.

   

Terminal intégré

1. Ouvrez un terminal intégré à partir du terminal -> Nouveau terminal.

2. Créez une branche nommée MY-BRANCH avec la commande git suivante :

   git checkout -b MY-BRANCH
   

Valider les modifications localement

Une fois que vous avez apporté des modifications sur votre branche, validez les modifications.

Barre d’activité

1. Sélectionnez le contrôle de code source dans la barre d’activité.

2. Entrez votre message de validation, puis sélectionnez Valider.

   

Barre d’état

Cette action n’est pas disponible à partir de cette fonctionnalité. Sélectionnez un autre onglet.

Palette de commandes

1. Ouvrez la palette de commandes avec la combinaison de touches Ctrl + Maj + P.
2. Dans la palette de commandes, filtrez avec Git puis sélectionnez Commit.
3. Entrez votre message de validation, puis appuyez sur Entrée.

Terminal intégré

1. Ouvrez un terminal intégré à partir du terminal -> Nouveau terminal.

2. Créez une branche nommée MY-BRANCH avec la commande git suivante :

   git commit -m "YOUR COMMIT MESSAGE"
   

Envoyer (push) une branche locale vers GitHub

Barre d’activité

1. Sélectionnez l’icône de contrôle de code source dans la barre d’activité.
2. Sélectionnez Publier la branche. Si le référentiel n’existe pas sur GitHub, il crée le référentiel pour vous.

Barre d’état

1. Dans la barre d’état de Visual Studio Code, sélectionnez l’icône Envoyer à droite du nom de la branche.

   

2. Sélectionnez le nom du dépôt distant dans la zone contextuelle. Si vous n’avez qu’un seul dépôt distant, vous ne serez pas invité à sélectionner son nom.

Palette de commandes

1. Ouvrez la palette de commandes avec la combinaison de touches Ctrl + Maj + P.
2. Dans la palette de commandes, filtrez avec Git puis sélectionnez Push.
3. Si vous avez plusieurs distances en amont, sélectionnez la télécommande, puis appuyez sur Entrée.

Terminal intégré

1. Ouvrez un terminal intégré à partir du terminal -> Nouveau terminal.

2. Créez une branche nommée MY-BRANCH avec la commande git suivante :

   git push <remote-name> <branch-name>
   

Afficher la sortie de Git

Vous pouvez visualiser l’exécution des commandes Git quand vous utilisez l’extension Contrôle de code source. Cela permet de déboguer lorsqu’une commande échoue.

1. Sélectionnez l’icône de contrôle de code source dans la barre d’activité.

2. Sélectionnez les points de suspension (...), puis sélectionnez Afficher la sortie Git.

   

Outils Visual Studio Code pour travailler avec Git et GitHub

Utiliser un dépôt dans Visual Studio Code se fait avec des outils distincts.

Icône	Information	Accès à partir de
	Commandes Git dans la palette de commandes	F1
	Extension du contrôle de code source	Barre d’activité
	Extension Demandes de tirage et problèmes GitHub	Barre d’activité
	Extension Dépôts GitHub	Vous pouvez ouvrir rapidement et facilement un dépôt GitHub en recherchant Dépôts GitHub : Ouvrir un dépôt... à partir de la palette de commandes, F1, ou en choisissant Ouvrir un dépôt GitHub... à partir de l’indicateur distant (le bouton vert dans le coin inférieur gauche de la barre d’état).

Ressources associées

• Comment déployer une application web
• Utilisation de GitHub dans Visual Studio Code
• Utilisation de Visual Studio Code avec d’autres fournisseurs de gestion de version