GNU/Linux >> Tutoriales Linux >  >> Panels >> Docker

Cómo editar código en contenedores Docker con Visual Studio Code

Desarrollar o depurar código dentro de contenedores Docker puede ser complicado. Por lo general, se adjuntaría al contenedor y usaría las utilidades de shell para editar archivos. La extensión de contenedores remotos de Visual Studio Code le permite abrir carpetas dentro de contenedores, para que pueda trabajar con ellos en su editor de código.

El desarrollo remoto funciona con Docker Desktop 2.0 y superior para Windows y macOS y Docker Engine 18.06 y superior para Linux. Si usa Windows 10 Home, debe tener instalada la actualización de abril de 2020, Docker Desktop 2.3 y el subsistema de Windows para Linux.

En el lado del contenedor, VS Code es compatible con contenedores x64 y ARM. Puede utilizar los sistemas operativos Alpine, Debian, Ubuntu, CentOS y RHEL. Si su imagen base no funciona desde el primer momento, debería poder instalar paquetes adicionales dentro de ella para completar la conexión.

Cómo empezar

Inicie VS Code, presione Ctrl+Shift+P y busque "extensiones". Seleccione el elemento "Instalar extensiones" para abrir la barra lateral. En el panel de extensiones, busque "Remote - Containers" e instale el elemento correspondiente.

Después de que se instale la extensión, aparecerá un nuevo botón verde en la parte inferior izquierda de la barra de estado. Haga clic aquí para abrir la paleta de comandos, precargada con los comandos remotos disponibles. Si prefiere evitar usar el mouse, también puede encontrar los comandos presionando Ctrl + Shift + P y escribiendo "remoto". La extensión también aparecerá en otras áreas de la interfaz de usuario, como la página de bienvenida y el panel de apertura de carpetas.

Para abrir su primera carpeta Dockerizada, abra la lista de comandos y seleccione "Adjuntar al contenedor en ejecución". Deberá reconocer una advertencia de que el contenedor podría ejecutar código no confiable. Solo debe adjuntar contenedores creados a partir de imágenes en las que confíe, ya que un contenedor malicioso con un archivo de espacio de trabajo de VS Code podría comprometer su sistema.

VS Code mostrará una lista de los contenedores Docker que se ejecutan en su sistema. Seleccione el contenedor al que desea conectarse. Se abrirá una nueva ventana. Puede tardar unos segundos en iniciarse mientras VS Code instala sus componentes de servidor remoto en el contenedor. Verá el contenedor activo en la parte inferior izquierda de la barra de estado.

Una vez que la ventana esté lista, puede comenzar a trabajar. Haga clic en el botón "Abrir carpeta" en el panel izquierdo para que aparezca un indicador de selección de archivos. Esto muestra el sistema de archivos dentro El contenedor. Navega hasta el directorio que te gustaría abrir y presiona "Aceptar".

La barra lateral se actualizará para mostrar el contenido del directorio seleccionado. Haga clic en cualquiera de los archivos para abrirlo en el editor de VS Code. Ahora puede realizar cambios dentro del contenedor, sin copiar archivos manualmente ni configurar un montaje de enlace de directorio de trabajo. Esto maximiza la eficiencia cuando se utiliza un entorno de desarrollo dockerizado o se depura un contenedor que no funciona correctamente.

El conjunto completo de funciones de VS Code está disponible, incluida la finalización de código de IntelliSense y su kit de herramientas de depuración. Paneles como la consola y la terminal se adjuntarán a los flujos de entrada y salida del contenedor.

¿Cómo funciona?

Lo primero que debe reconocer sobre la integración es que VS Code alterará el sistema de archivos de su contenedor. Instalará un servidor en los contenedores a los que se conecta, que envía información al cliente del editor.

El servidor supervisa el sistema de archivos, lee archivos e inicia procesos dentro del contenedor. Esto impulsa capacidades como el depurador de VS Code. El editor le pedirá al servidor que ejecute su fuente, permitiéndole inspeccionar el código que se ejecuta dentro del contenedor.

De manera similar, VS Code instalará copias de sus otras extensiones dentro del contenedor. Esto garantiza que tengan acceso completo al sistema de archivos del contenedor, por lo que funcionarán sin discrepancias en comparación con una carpeta local. El resultado final es una experiencia de editor completa que funciona de forma transparente, aunque se extienda a través de su host y contenedores. Según el tamaño de su entorno, la configuración de la primera ejecución puede tardar unos minutos, pero el servidor contenedor se almacenará en caché para su uso posterior.

Contenedores de desarrollo

Más allá de abrir archivos en un contenedor existente, el sistema remoto le permite definir contenedores de desarrollo que encapsulan su entorno de trabajo. Dicho contenedor debe incluir todas las dependencias de software que instalaría antes de desarrollar su aplicación localmente.

Cuando está utilizando un contenedor de desarrollo, puede enlazar el montaje de su directorio de trabajo o utilizar un volumen aislado. La última opción evita la contaminación del sistema de archivos y ofrece un rendimiento mejorado, ya que es más nativo de Docker.

Los contenedores de desarrollo se crean a partir de .devcontainer/devcontainer.json archivos Estos describen la configuración de Docker y Visual Studio que inicia su entorno de desarrollo.

{
    "image": "mcr.microsoft.com/vscode/devcontainers/javascript-node:16",
    "extensions": "EditorConfig.EditorConfig",
    "forwardPorts": [3000]
}

devcontainer.json El archivo que se muestra arriba configura un contenedor de desarrollo que usa la plantilla Node.js de Microsoft. La extensión EditorConfig VS Code está habilitada, agregando soporte para .editorconfig archivos en su directorio de trabajo. Luego, el puerto 3000 se asigna desde el host al contenedor.

Los archivos de contenedor de desarrollo también admiten algunas otras opciones. Puede configurar VS Code settings.json valores, agregue un comando para ejecutar dentro del contenedor y defina el usuario con el que se ejecutará el servidor de VS Code.

Si no desea crear un archivo de configuración de contenedor usted mismo, Contenedores remotos:agregar archivos de configuración de desarrollo El comando agregará uno a su proyecto automáticamente. Podrá seleccionar de una lista de plantillas preconfiguradas que puede personalizar más adelante.

Una vez que tenga un devcontainer.json en su proyecto, ejecute Remote-Containers:Rebuild Container comando de la paleta de comandos. Esto creará una imagen de contenedor utilizando la configuración especificada. Cuando se complete la compilación, ejecute Remote-Containers:Reabrir carpeta en contenedor para abrir su directorio local actual dentro de un nuevo contenedor de desarrollo.

Si está utilizando un repositorio de Git, generalmente es más sencillo clonar el repositorio directamente en un contenedor. Los Contenedores Remotos:Clonar Repositorio en Volumen de Contenedor El comando acepta una URL de Git para clonar. Creará un nuevo volumen y lo adjuntará a una instancia de contenedor de desarrollo. Esto le permite trabajar en repositorios de Git sin clonarlos en su sistema de archivos local, evitando la contaminación innecesaria. VS Code comparte automáticamente sus credenciales locales de Git con el contenedor.

Configurando la Extensión

La extensión Remote – Containers viene con varias configuraciones que le permiten configurar su experiencia de contenedor. Puede encontrarlos en Remote-Containers:Configuración para Remote-Containers comando.

La primera colección de configuraciones se refiere a los archivos de puntos. Los archivos de puntos se refieren a archivos de configuración que comienzan con un punto (. ). Remote-Containers puede clonar automáticamente un repositorio Git de dotfiles en nuevos contenedores, lo que le ayuda a empezar a trabajar con su configuración habitual.

Agrega la URL de tu repositorio de dotfiles al Repository entorno. El repositorio se clonará en la Target Path ruta, que por defecto es ~/dotfiles . Si desea ejecutar un comando después de clonar el repositorio, especifíquelo como Install Command .

Los contenedores remotos usan de forma predeterminada docker como el binario que ejecuta los comandos del contenedor. Puede cambiar esto a cualquier binario compatible con Docker CLI con Docker Path entorno. Si usa Podman, especifique podman ya que este valor le permitirá trabajar con sus contenedores usando VS Code.

Puede configurar extensiones remotas predeterminadas en Default Extensions título. Haga clic en "Agregar elemento" para elegir una extensión para agregar a cada contenedor. Esto le permite garantizar la disponibilidad global de sus extensiones de uso obligatorio, incluso si no están incluidas en un devcontainer.json archivo.

Un grupo final de configuraciones se refiere a la configuración de Git. Cuando se marca "Copiar Git Config", su .gitconfig local El archivo se copiará automáticamente en contenedores automáticamente. Habilitar esto garantiza que sus confirmaciones se atribuyan correctamente a los detalles de usuario que ya está usando localmente.

La configuración "Ubicación de configuración del ayudante de credenciales de Git" controla el archivo de configuración en el que se escribirán las nuevas credenciales de Git. Puede seleccionar desde su archivo local por usuario, ~/.gitconfig , o la ubicación del sistema global, /etc/gitconfig .

Resumen

La extensión Remote – Containers para Visual Studio Code le permite editar archivos y carpetas dentro de los contenedores de Docker. Funciona a la perfección con las funciones del editor de VS Code, que incluyen IntelliSense, indexación de directorios, depuración y extensiones. Internamente, VS Code lanza un servidor de desarrollo dentro del contenedor para que sus herramientas tengan acceso completo al sistema de archivos con el que están trabajando.

Hay varios casos de uso posibles para esta funcionalidad, con entornos de desarrollo dockerizados y ediciones de contenedores sobre la marcha como los principales contendientes. Mientras que la idea El uso de contenedores para sistematizar el desarrollo ha existido por un tiempo, VS Code hace que sea mucho más fácil comenzar al ofrecer una experiencia IDE que comprende Docker de forma nativa.

Podría preparar una imagen de Docker que brinde a los desarrolladores todo lo que necesitan para trabajar en su sistema:lenguaje de programación, dependencias y herramientas convenientes. Los desarrolladores iniciarían un contenedor, se conectarían a él desde VS Code y realizarían su trabajo sin instalar nada (excepto Code) en su propia máquina. Si es necesario parchear una dependencia, solo necesita actualizar la imagen compartida de Docker y hacer que los desarrolladores obtengan la nueva etiqueta.


Docker
  1. Cómo implementar un contenedor nginx con Docker en Linode

  2. Cómo compartir datos entre contenedores Docker

  3. Cómo listar contenedores Docker

  4. Cómo hacer una copia de seguridad y restaurar contenedores Docker

  5. Cómo pausar y reanudar contenedores Docker

Cómo instalar el código de Visual Studio en Ubuntu 22.04

Cómo copiar archivos con Docker cp a su Docker Container

Cómo usar SSH en contenedores Docker [paso a paso]

Cómo ejecutar contenedores Docker

Cómo nombrar o renombrar contenedores Docker

Cómo gestionar contenedores Docker