Integración de Git en Visual Studio Code
Visual Studio Code incluye integración con Git sin necesidad de instalar ninguna extensión extra. Solo es necesario tener Git instalado en el sistema previamente, ya que VS Code hace uso de la herramienta.
Veremos cómo usar las funcionalidades que brinda y cómo se compara con la línea de comandos.
Creación
Para emular lo antes realizado mediante comandos, vamos a comenzar creando un directorio para un proyecto, donde queremos crear un nuevo repositorio.
Desde el nuevo directorio vamos a abrir VS Code.
Dentro de VS Code vamos a observar que en la Barra de Actividades (a la izquierda), hay una sección dedicada al control de versiones con Git, llamada Source Control (si mantenemos el cursor sobre el ícono, aparecerá el nombre y el atajo de teclado).
Los íconos que veamos aquí dependerán de nuestra configuración, pero en general, los primeros 5 vienen por defecto. Estos son, en orden: Explorer, Search, Source Control, Run and Debug y Extensions.
Al abrir la sección de Source Control, veremos que nos indica que no existe un repositorio, y nos permitirá crear uno presionando un botón.
Al crear el repositorio, ahora VS Code nos muestra una columna titulada Source Control, donde se listarán los archivos modificados (Changed), agregados al área de staging (Staged Changes) y archivos en conflicto (Merge Changes), los cuales estudiaremos más adelante.
Además, en el lado izquierdo de la barra de estado, figurará el nombre de la branch en la que nos encontramos, en este caso, main.
Si abrimos VS Code en un directorio que ya contenía un repositorio, VS Code lo va a detectar inmediatamente.
Y en adelante, cada cambio que hagamos se podrá visualizar en esta sección.
Agregar nuevos archivos al repositorio
Si ahora creamos un nuevo archivo, este va a figurar en la lista de archivos modificados, marcado con una letra U, que significa untracked.
También veremos que sobre el ícono de control de versiones (Source Control), sobre la Barra de Actividades, figura un círculo con el número de archivos que sufrieron cambios en el repositorio (en este caso un 1).
Si accedemos a la sección Source Control, veremos que el archivo figura en la lista de archivos modificados (Changes).
Si hacemos clic en el nombre del archivo, se abrirá a la derecha en un modo especial, mostrando los cambios que tiene el archivo. Si es un archivo nuevo (como en nuestro ejemplo) todas sus líneas estarán marcadas con un fondo verde.
VS Code nos brinda una forma muy simple de agregar archivos nuevos (y modificados) al área de staging, usando el botón con el símbolo “+” que se encuentra al lado del nombre del archivo.
Por otro lado, podemos ver que hay otros 2 íconos a la derecha del nombre del archivo, el primero sirve para abrir el archivo en modo normal (como está en la imagen), y el segundo sirve para volver atrás los cambios que se le haya hecho.
En nuestro caso, ya que el archivo es nuevo, si intentamos volver los cambios atrás, esto significaría eliminar el archivo.
Cuando presionamos el botón para agregar el archivo al área de staging dejará de figurar en la lista Changes y pasará a estar en la lista Staged Changes.
Además, podremos ver que ahora el archivo tiene a su derecha una letra A, (de Added) en lugar de la letra U.
Y, si mantenemos el cursor sobre el nombre del archivo, nos mostrará un símbolo ‘-’ para quitar al archivo del área de staging.
De esta forma cuando tengamos más archivos, podremos ver específicamente cuáles se van a agregar al próximo commit y cuáles no.
Guardar cambios
Cuando estemos listos para realizar un commit, simplemente tenemos que escribir un mensaje para el commit en el cuadro de entrada de texto ubicado en la parte superior y luego presionar el botón etiquetado ”✓ Commit”.
Una vez realizado el commit, no quedará ningún archivo en la lista de Staged Changes. Y, en nuestro caso, tampoco quedará ningún archivo en la lista de Changes.
Lo que podremos ver, es que aparecerá un botón con la leyenda “Publish Branch”, que quiere decir, subir branch a un repositorio remoto.
Como todavía no tenemos un repositorio remoto configurado, si hacemos clic en el botón, nos pedirá autorización para crear el repositorio remoto, en GitHub (ya que la extensión que genera el pedido es la de GitHub, preinstalada en VS Code).
VS Code nos pedirá autenticarnos en nuestra cuenta de GitHub mediante el navegador predeterminado, para darle a VS Code los permisos para crear el nuevo repositorio en la nube.
Una vez autenticado, VS Code nos solicitará un nombre para el repositorio (tomando el nombre del directorio local por defecto) y nos dará a elegir si el repositorio será privado o público.
Subir cambios a un repositorio remoto
Si ya tenemos configurado un repositorio remoto, VS Code lo detectará y nos permitirá subir o bajar cambios en la branch actual.
Para subir cambios que hayamos realizado en local tenemos dos opciones.
Usando el botón “Sync Changes” que aparece en la sección Source Control después de realizar un commit.
Esta acción nos advertirá que VS Code realizará, primero un pull y luego un push al repositorio remoto.
O utilizar el botón ubicado en la barra de estado, al lado del nombre de la branch, que dice “Synchronize Changes” con un símbolo de recargar (dos flechas formando un círculo).
También nos dará la misma advertencia.
Bajar cambios de un repositorio remoto
Si, por ejemplo, nosotros o alguien más realiza cambios en el repositorio remoto, y queremos descargar esos cambios a nuestro repositorio local, podemos usar el mismo botón de sincronización usado antes. La sincronización incluye realizar un pull de la branch remota ligada a nuestra branch local. Por lo tanto, se descargarán los cambios (commits) y se fusionarán con nuestra rama local.
Por otro lado, si solo queremos realizar un fetch de los cambios (es decir, no realizar el merge que implica un pull), podemos hacer clic en los tres puntos en la sección de Source Control, y se desplegarán los comando que podemos realizar, entre ellos, fetch.
Si han habido cambios en el repositorio remoto, veremos que aparecerá el mismo botón de “Sync Changes”, pero esta vez con una flecha hacia abajo, indicando que hay cambios en el repositorio remoto que podemos fusionar con nuestra branch local.
