Como editar o código em contêineres do Docker com o código do Visual Studio

Conteúdo

Gráfico mostrando o ícone de código do Visual Studio

Desenvolver ou depurar código em contêineres Docker pode ser complicado. Em geral, Gostaria de anexá-lo ao contêiner e usar os utilitários do shell para editar arquivos. A extensão Remote Containers do Visual Studio Code permite que você abra pastas dentro de contêineres, para que você possa trabalhar com eles em seu editor de código.

Desenvolvimento remoto funciona com Docker Desktop 2.0 e superior para Windows e macOS e Docker Engine 18.06 e superior para Linux. Se você estiver usando Windows 10 Casa, deve ter atualização de abril 2020, Docker Desktop 2.3 e subsistema Windows para Linux instalado.

Na lateral do contêiner, O VS Code oferece suporte a contêineres x64 e ARM. Pode usar sistemas operacionais Alpine, Debian, Ubuntu, CentOS e RHEL. Se sua imagem de base não funcionar imediatamente, você deve ser capaz de instalar pacotes adicionais dentro dele para conexão completa.

Iniciando

Inicie o código VS, presione Ctrl + Mudança + P e olha “extensões”. Selecionar item “Instale extensões” para abrir a barra lateral. Dentro do painel de extensões, eu pesquisei “Controlo remoto – Containers” e instale o respectivo elemento.

Depois que a extensão for instalada, um novo botão verde aparecerá na parte inferior esquerda da barra de status. Clique aqui para abrir a paleta de comandos, pré-carregado com comandos remotos disponíveis. Se você preferir evitar usar o mouse, você também pode encontrar os comandos pressionando Ctrl + Mudança + P e digitação “controlo remoto”. A extensão também aparecerá em outras áreas da interface do usuário, como a página de boas-vindas e o painel de abertura de pasta.

Para abrir sua primeira pasta Dockerized, abra a lista de comandos e selecione “Anexar ao contêiner em execução”. Você deve reconhecer um aviso de que o contêiner pode executar código não confiável. Você só deve anexar a contêineres criados a partir de imagens em que você confia, já que um contêiner malicioso com um arquivo de espaço de trabalho do VS Code pode comprometer seu sistema.

VS Code irá listar os contêineres Docker em execução em seu sistema. Selecione o contêiner ao qual deseja se conectar. Uma nova janela se abrirá. Pode demorar alguns segundos para iniciar enquanto o VS Code instala seus componentes de servidor remoto no contêiner. Você verá o contêiner ativo exibido na parte inferior esquerda da barra de status.

Assim que a janela estiver pronta, pode começar a trabalhar. Clique no botão “Pasta aberta” no painel esquerdo para abrir um prompt do seletor de arquivos. Isso mostra o sistema de arquivos Dentro de O recipiente. Navegue até o diretório que deseja abrir e pressione “Aceitar”.

A barra lateral será atualizada para mostrar o conteúdo do diretório selecionado. Clique em qualquer um dos arquivos para abri-lo no editor de código VS. Agora você pode fazer alterações dentro do contêiner, sem copiar arquivos manualmente ou definir uma montagem de link de diretório de trabalho. Isso maximiza a eficiência ao usar um ambiente de desenvolvimento Dockerized ou depurar um contêiner com defeito.

O conjunto completo de recursos do VS Code está habilitado, incluindo a conclusão do código IntelliSense e seu kit de ferramentas de depuração. Painéis como o console e o terminal serão anexados aos fluxos de entrada e saída do contêiner.

Como funciona?

A primeira coisa a reconhecer sobre a integração é que o VS Code alterará o sistema de arquivos do seu contêiner. Você instalará um servidor nos contêineres aos quais se conectar, que enviará informações ao cliente da editora.

Diagrama mostrando a arquitetura de extensão de contêiner remoto do Visual Studio Code

O servidor monitora o sistema de arquivos, ler arquivos e iniciar processos dentro do contêiner. Isso potencializa recursos como o depurador VS Code. O editor irá pedir ao servidor para executar sua fonte, permitindo que você inspecione o código em execução dentro do contêiner.

de forma similar, O VS Code instalará cópias de suas outras extensões dentro do contêiner. Isso garante que eles tenham acesso total ao sistema de arquivos do contêiner, então eles irão operar sem discrepâncias em comparação com uma pasta local. O resultado final é uma experiência de editor completa que funciona perfeitamente., mesmo que se estenda por seu host e contêineres. Dependendo do tamanho do seu ambiente, a configuração da primeira execução pode levar alguns minutos, mas o servidor de contêiner será armazenado em cache para uso posterior.

Contêineres de desenvolvimento

Além de abrir arquivos em um contêiner existente, o sistema remoto permite que você configure contêineres de desenvolvimento que encapsulam seu ambiente de trabalho. Este contêiner deve incluir todas as dependências de software que você instalaria antes de desenvolver seu aplicativo localmente..

Quando você usa um contêiner de desenvolvimento, poderia ou montagem de link seu diretório de trabalho ou use um volume isolado. A última opção evita a contaminação do sistema de arquivos e oferece desempenho aprimorado, já que é mais nativo do Docker.

Os contêineres de desenvolvimento são criados a partir de .devcontainer/devcontainer.json registros. Eles descrevem a configuração do Docker e do Visual Studio que inicia seu ambiente de desenvolvimento.

{
    "imagem": "mcr.microsoft.com/vscode/devcontainers/javascript-node:16",
    "extensões": "EditorConfig.EditorConfig",
    "forwardPorts": [3000]
}

a devcontainer.json arquivo mostrado acima configura um contêiner de desenvolvimento que a Microsoft usa Plantilla Node.js. a EditorConfig A extensão do código VS está habilitada, adicionando suporte para .editorconfig arquivos em seu diretório de trabalho. Depois de, o Porto 3000 é mapeado do host para o contêiner.

Arquivos de contêiner de desenvolvimento suportam um algumas outras opções O que mais. Você pode definir o código VS settings.json valores, adicione um comando para executar dentro do contêiner e defina o usuário com o qual o servidor VS Code será executado.

Se você não quiser criar um arquivo de configuração de contêiner sozinho, a Recipientes remotos: adicionar arquivos de configuração de desenvolvimento O comando irá adicionar um ao seu projeto automaticamente. Poderá escolher a partir de uma lista de modelos pré-configurados que pode personalizar mais tarde.

Depois de ter um devcontainer.json arquivo em seu projeto, execute o Recipientes remotos: Recipiente de reconstrução comando da paleta de comando. Isso criará uma imagem de contêiner usando as configurações especificadas. Quando a construção estiver completa, corre Recipientes remotos: reabrir a pasta no contêiner para abrir seu diretório local atual dentro de um novo contêiner de desenvolvimento.

Se você estiver usando um repositório Git, em geral, é mais fácil clonar o repositório diretamente em um contêiner. a Recipientes remotos: Clone o repositório para o volume do contêiner O comando aceita um url Git para clonar. Crie um novo volume e anexe-o a uma instância de contêiner de desenvolvimento. Isso permite que você trabalhe em repositórios Git sem cloná-los em seu sistema de arquivos local, evitando contaminação desnecessária. O VS Code compartilha automaticamente suas credenciais Git locais com o contêiner.

Configure a extensão

A extensão remota – Os contêineres vêm com várias configurações que permitem configurar sua experiência de contêiner. Você pode encontrá-los com o Recipientes remotos: configuração para contêineres remotos comando.

A primeira coleção de configurações refere-se a arquivos de ponto. Arquivos de ponto referem-se a arquivos de configuração que começam com um ponto (.). Os Remote-Containers podem clonar automaticamente um repositório Git de dotfiles em novos containers, o que ajuda você a executar sua configuração normal.

Adicione o URL do repositório dotfiles ao Repository configuração. O repositório será clonado no Target Path rota, que por padrão é ~/dotfiles. Se você deseja executar um comando após clonar o repositório, especifique-o como Install Command.

Recipientes remotos usam por padrão docker como o binário que executa os comandos do contêiner. Você pode alterar isso para qualquer binário compatível com o Docker CLI com o Docker Path configuração. Si está usando Podman, especificando podman já que este valor permitirá que você trabalhe com seus contêineres usando o código VS.

Você pode configurar extensões remotas padrão no Default Extensions Cofre. Clique em “Adicionar Item” para selecionar uma extensão para adicionar a cada contêiner. Isso permite que você garanta a disponibilidade global de suas extensões necessárias., mesmo se eles não estiverem listados em um devcontainer.json procedimentos.

Um último grupo de configurações refere-se às configurações do Git. Quando está marcado “Copiar configuração Git”, Está .gitconfig O arquivo será copiado automaticamente para os contêineres. Ativar isso garante que seus commits sejam atribuídos corretamente aos detalhes do usuário que você já está usando localmente.

A configuração de “Local de configuração do assistente de credencial Git” controla o arquivo de configuração no qual as novas credenciais Git serão gravadas. Você pode escolher seu arquivo local por usuário, ~/.gitconfig, ou a localização do sistema global, /etc/gitconfig.

Resumo

A extensão remota – Contêineres para Visual Studio Code permite que você edite arquivos e pastas dentro de contêineres do Docker. Funciona perfeitamente com as funções do editor de código VS, incluindo IntelliSense, indexação de diretório, depuração e extensões. Internamente, O VS Code inicia um servidor de desenvolvimento dentro do contêiner para que suas ferramentas tenham acesso total ao sistema de arquivos com o qual estão trabalhando.

Existem vários casos de uso possíveis para esta funcionalidade, com ambientes de desenvolvimento Dockerized e edições on-the-fly de contêineres como os principais concorrentes. Enquanto o ideia de usar contêineres para sistematizar o desenvolvimento já existe há algum tempo, O VS Code torna muito mais fácil começar, oferecendo uma experiência IDE que compreende nativamente o Docker.

Você pode preparar uma imagem Docker que oferece aos desenvolvedores tudo de que precisam para trabalhar em seus sistemas: linguagem de programação, dependências e ferramentas de conveniência. Os desenvolvedores iniciariam um contêiner, eles se conectariam a ele a partir do VS Code e fariam seu trabalho sem instalar nada (exceto Código) em sua própria máquina. Se corrigir uma dependência, você só precisa atualizar a imagem do docker compartilhada e fazer com que os desenvolvedores puxem a nova tag.

Assine a nossa newsletter

Nós não enviaremos SPAM para você. Nós odiamos isso tanto quanto você.