Clonación y uso de un repositorio de GitHub en Visual Studio Code

Conozca los pasos para clonar un repositorio público de GitHub en el equipo local mediante Visual Studio Code.

Apertura del repositorio remoto

Abra el repositorio remoto en el equipo local.

Barra de actividad

1. Instalación de la extensión del repositorio remoto
2. Seleccione el indicador remoto en la parte inferior izquierda de Visual Studio Code.
3. Siga las instrucciones.

Barra de estado

Esta acción no está disponible en esta característica. Seleccione otra pestaña.

Paleta de comandos

1. Abra la paleta de comandos con la combinación de teclas ctrl + Mayús + P.
2. En el símbolo de la paleta de comandos, escriba gitcl, seleccione el comando Git: Clone y, a continuación, seleccione Clonar desde GitHub y presione Entrar.
3. Cuando se le pida el valor de URL del repositorio, seleccione clonar en GitHub y, a continuación, presione Entrar.
4. Si se le pide que inicie sesión en GitHub, complete el proceso de inicio de sesión.
5. Escriba azure-samples/js-e2e-express-server en el campo URL del repositorio.
6. Seleccione (o cree) el directorio local en el que desea clonar el proyecto y, a continuación, seleccione Seleccionar como destino del repositorio.
7. Cuando reciba la notificación que le pregunta si desea abrir el repositorio clonado, seleccione Abrir.

Terminal integrado

1. Abra un terminal integrado desde Terminal -> Nuevo terminal.

2. Clone el repositorio con el siguiente comando de Git:

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

3. Abra en Visual Studio Code:

   code YOUR-REPO-NAME
   

Visual Studio Code usa la autenticación de Git proporcionada por el sistema operativo (como macOS KeyChain o el administrador de credenciales de Windows) con cualquier funcionalidad de Git. La salida está visible en Git de paleta > de comandos: Mostrar salida de Git.

Apertura del repositorio local

Si tiene un repositorio existente en el equipo local y quiere abrirlo en Visual Studio Code, abra la carpeta . Visual Studio Code reconoce la .git subcarpeta y muestra la información pertinente.

Barra de actividad

1. Seleccione Ctrl + K + O.
2. Seleccione la carpeta .

Barra de estado

Esta acción no está disponible en esta característica. Seleccione otra pestaña.

Paleta de comandos

1. Abra la paleta de comandos con la combinación de teclas ctrl + Mayús + P.
2. Filtre por Gity, a continuación, seleccione Open repository.
3. Seleccione la carpeta para seleccionar como raíz del repositorio.

Terminal integrado

1. Abra un terminal integrado desde Terminal -> Nuevo terminal.

2. Abra una nueva instancia de Visual Studio Code para el directorio del repositorio:

   code ../dir1/dir2/my-repo
   

Inicialización del nuevo repositorio

Use el procedimiento siguiente para crear un repositorio de código fuente local con git.

Barra de actividad

1. Seleccione el control de código fuente de la barra de actividad o use la combinación de teclas Ctrl + Mayús + G.

2. Seleccione Inicializar repositorio.

   

Barra de estado

Esta acción no está disponible en esta característica. Seleccione otra pestaña.

Paleta de comandos

1. Abra la paleta de comandos con la combinación de teclas ctrl + Mayús + P.
2. Filtre por Gity, a continuación, seleccione Initialize repository.
3. Seleccione la carpeta para seleccionar como raíz del repositorio.

Terminal integrado

1. Abra un terminal integrado desde Terminal -> Nuevo terminal.

2. Inicialice la carpeta con Git con el siguiente comando de Git:

   git init
   

Una vez inicializado el repositorio, cree el repositorio en GitHub. A continuación, agregue ese repositorio como remoto al proyecto local desde la paleta de comandos: busque Git: Add remote.

Creación de una rama para cambios

Cree una nueva rama para capturar los cambios y aislarlos de la rama principal o predeterminada.

Barra de actividad

1. Seleccione el control de código fuente en la barra de actividad.
2. Seleccione puntos suspensivos (...) junto a Control de código fuente.
3. Seleccione Rama ->Crear rama.

Barra de estado

1. Seleccione el nombre de la rama en la barra de estado. Se abrirá la paleta de comandos.

   La barra de estado se encuentra en la parte inferior de Visual Studio Code.

2. En la paleta de comandos, seleccione ++Crear una nueva rama.

3. Escriba el nombre de la nueva rama.

4. Escriba un nuevo nombre para la rama. El nombre de la rama está visible en la barra de estado.

   

Paleta de comandos

1. Abra la paleta de comandos con la combinación de teclas ctrl + Mayús + P.

2. Busque git branch y seleccione Git: Create Branch.

   

3. Escriba un nuevo nombre de rama, como test.

4. El nombre de la rama está visible en la barra de estado.

   

Terminal integrado

1. Abra un terminal integrado desde Terminal -> Nuevo terminal.

2. Cree una rama denominada MY-BRANCH con el siguiente comando de Git:

   git checkout -b MY-BRANCH
   

Confirmar cambios localmente

Una vez realizados los cambios en la rama, confirme los cambios.

Barra de actividad

1. Seleccione el control de código fuente en la barra de actividad.

2. Escriba el mensaje de confirmación y seleccione Confirmar.

   

Barra de estado

Esta acción no está disponible en esta característica. Seleccione otra pestaña.

Paleta de comandos

1. Abra la paleta de comandos con la combinación de teclas ctrl + Mayús + P.
2. En la paleta de comandos, filtre por Git y seleccione Commit.
3. Escriba el mensaje de confirmación y presione Entrar.

Terminal integrado

1. Abra un terminal integrado desde Terminal -> Nuevo terminal.

2. Cree una rama denominada MY-BRANCH con el siguiente comando de Git:

   git commit -m "YOUR COMMIT MESSAGE"
   

Inserción de una rama local en GitHub

Barra de actividad

1. Seleccione el icono de control de código fuente en la barra de actividades.
2. Seleccione Publicar rama. Si el repositorio no existe en GitHub, crea automáticamente el repositorio.

Barra de estado

1. En la barra de estados de Visual Studio Code, seleccione el icono de inserción situado a la derecha del nombre de la rama.

   

2. Seleccione el nombre del entorno remoto en el cuadro emergente. Si solo tiene un entorno remoto, no se le pedirá que seleccione un nombre.

Paleta de comandos

1. Abra la paleta de comandos con la combinación de teclas ctrl + Mayús + P.
2. En la paleta de comandos, filtre por Git y seleccione Push.
3. Si tiene varios remotos ascendentes, seleccione el control remoto y presione Entrar.

Terminal integrado

1. Abra un terminal integrado desde Terminal -> Nuevo terminal.

2. Cree una rama denominada MY-BRANCH con el siguiente comando de Git:

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

Visualización de la salida de Git

Puede ver los comandos de Git que se ejecutan cuando se usa la extensión de control de código fuente. Esto ayuda a depurar cuando se produce un error en un comando.

1. Seleccione el icono de control de código fuente en la barra de actividades.

2. Seleccione los puntos suspensivos (...) y, a continuación, seleccione Mostrar salida de GIT.

   

Herramientas de Visual Studio Code para trabajar con Git y GitHub

Para trabajar en Visual Studio Code con un repositorio, se usan distintas herramientas.

Iconos	Información	Acceso desde
	Comandos de Git en la paleta de comandos	F1
	Extensión de control de código fuente	Barra de actividades
	Extensión de solicitud de incorporación de cambios y problemas de GitHub	Barra de actividades
	Extensión de repositorios de GitHub	Puede abrir de forma rápida y sencilla un repositorio de GitHub mediante la búsqueda de repositorios de GitHub: Abrir repositorio... en la paleta de comandos, F1 o eligiendo Abrir repositorio de GitHub... en el indicador remoto (el botón verde de la esquina inferior izquierda de la barra de estado).

Recursos relacionados

• Cómo implementar una aplicación web
• Uso de GitHub en Visual Studio Code
• Uso de Visual Studio Code con otros proveedores de control de versiones