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

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

O 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 o Windows 10 Home, deverá ter a atualização de abril de 2020, Docker Desktop 2.3 e o subsistema do Windows para Linux instalados.

No lado do contêiner, o VS Code é compatível com os contêineres x64 e ARM. Você pode usar os sistemas operacionais Alpine, Debian, Ubuntu, CentOS e RHEL. Se a sua imagem de base não funcionar fora da caixa, você deve ser capaz de instalar pacotes adicionais dentro dela para completar a conexão.

Primeiros passos

Inicie o VS Code, pressione Ctrl + Shift + P e pesquise “ extensões ”. Selecione a opção “ Instalar extensões ” item para abrir a barra lateral. No painel de extensões, pesquise por “ Remoto – Recipientes ” e instale o item correspondente.

Após a instalação da extensão, um novo botão verde aparecerá no canto inferior esquerdo da sua barra de status. Clique aqui para abrir a paleta de comandos, pré-preenchida com os comandos remotos disponíveis. Se você preferir evitar o uso do mouse, também pode encontrar os comandos pressionando Ctrl + Shift + P e digitando “ remoto ”. A extensão aparecerá em outras áreas da IU também, como a página de boas-vindas e o painel de abertura de pasta.

Publicidade

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

O VS Code exibirá uma lista dos contêineres Docker em execução em seu sistema. Selecione o contêiner ao qual deseja se conectar. Uma nova janela será aberta. Pode levar alguns segundos para iniciar enquanto o VS Code instala seus componentes de servidor remoto no contêiner. Você verá o contêiner ativo exibido no canto inferior esquerdo da barra de status.

Quando a janela estiver pronta, você pode começar a trabalhar. Clique no botão “ Abrir pasta ” no painel esquerdo para abrir um prompt do seletor de arquivos. Isso exibe o sistema de arquivos dentro do contêiner. Navegue até o diretório que você &’ deseja abrir e pressione “ OK ”.

A barra lateral será atualizada para exibir o conteúdo do diretório selecionado. Clique em qualquer um dos arquivos para abri-lo no editor de código do VS. Agora você pode fazer alterações dentro do contêiner, sem copiar arquivos manualmente ou configurar uma montagem de ligação 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á disponível, incluindo o preenchimento de 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 isso funciona?

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

Publicidade

O servidor monitora o sistema de arquivos, lê arquivos e inicia processos dentro do contêiner. Isso potencializa recursos como o depurador do VS Code &’ s. O editor pedirá ao servidor para executar seu código-fonte, permitindo que ele inspecione o código em execução dentro do contêiner.

Da mesma forma, 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, para que operem sem discrepâncias em comparação com uma pasta local. O resultado final é uma experiência de editor totalmente desenvolvida que opera de forma transparente, mesmo que esteja espalhada por seu host e contêineres. Dependendo do tamanho do seu ambiente, a configuração da primeira execução pode levar alguns instantes, 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 definir contêineres de desenvolvimento que encapsulam seu ambiente de trabalho. Esse contêiner deve incluir todas as dependências de software que você &’ d instalar antes de desenvolver seu aplicativo localmente.

Quando estiver usando um contêiner de desenvolvimento, você pode ligar a montagem do seu diretório de trabalho ou usar um volume isolado. A última opção evita a poluição do sistema de arquivos e oferece melhor desempenho, pois é mais nativa do Docker.

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

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

O arquivo devcontainer. json mostrado acima configura um contêiner de desenvolvimento que usa o modelo Node. js da Microsoft. A extensão EditorConfig VS Code está habilitada, adicionando suporte para arquivos . editorconfig em seu diretório de trabalho. A porta 3000 é então mapeada do host para o contêiner.

Publicidade

Os arquivos de contêiner Dev também oferecem suporte a algumas outras opções. Você pode definir os valores de settings. json do VS Code, adicionar um comando para ser executado dentro do contêiner e definir o usuário com o qual o servidor do VS Code será executado.

Se você não quiser criar um arquivo de configuração de contêiner, o comando Remote-Containers: Adicionar arquivos de configuração de desenvolvimento adicionará um ao seu projeto automaticamente. Você poderá selecionar em uma lista de modelos pré-configurados que pode personalizar mais tarde.

Depois de obter um arquivo devcontainer. json em seu projeto, execute o comando Remote-Containers: Rebuild Container na paleta de comandos. Isso criará uma imagem de contêiner usando a configuração especificada. Quando a compilação for concluída, execute Remote-Containers: Reaopen Folder in Container para abrir seu diretório local atual em um novo contêiner de desenvolvimento.

Se você estiver usando um repositório Git, geralmente é mais simples clonar o repositório diretamente em um contêiner. O comando Remote-Containers: Clone Repository in Container Volume aceita uma URL Git para clonar. Ele criará um novo volume e o anexará 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 poluição desnecessária. O VS Code compartilha automaticamente suas credenciais Git locais com o contêiner.

Configurando a extensão

O controle remoto – A extensão de contêineres vem com várias configurações que permitem configurar sua experiência de contêiner. Você pode encontrá-los com o comando Remote-Containers: Settings for Remote-Containers.

A primeira coleção de configurações diz respeito a dotfiles. Dotfiles referem-se a arquivos de configuração que começam com um ponto (.). Os contêineres remotos podem clonar automaticamente um repositório Git de dotfiles em novos contêineres, ajudando você a executar suas configurações habituais.

Publicidade

Adicione o URL do seu repositório dotfiles à configuração Repositório. O repositório será clonado para o caminho do caminho de destino, que é padronizado como ~ / dotfiles. Se você quiser executar um comando depois que o repositório for clonado, especifique-o como Comando de instalação.

O padrão do Remote-Containers é usar docker como o binário que executa os comandos do container. Você pode alterar isso para qualquer binário compatível com Docker CLI com a configuração Docker Path. Se você estiver usando o Podman, especificar podman como este valor permitirá que você trabalhe com seus contêineres usando o código do VS.

Você pode configurar extensões remotas padrão sob o título Extensões padrão. Clique em “ Adicionar item ” para escolher uma extensão para adicionar a cada contêiner. Isso permite que você garanta a disponibilidade global de suas extensões obrigatórias, mesmo se elas não estiverem listadas em um arquivo devcontainer. json.

Um último grupo de configurações diz respeito à configuração do Git. Quando “ Copiar configuração do Git ” estiver marcada, seu arquivo . gitconfig local será copiado automaticamente para os contêineres. Habilitar isso garante que seus commits sejam atribuídos corretamente aos detalhes do usuário que você já está usando localmente.

O “ Git Credential Helper Config Location ” configuração controla o arquivo de configuração no qual as novas credenciais Git serão gravadas. Você pode selecionar em seu arquivo local por usuário, ~ / . gitconfig, ou no local do sistema global, / etc / gitconfig.

Resumo

O controle remoto – A extensão de contêineres para Visual Studio Code permite editar arquivos e pastas dentro de contêineres do Docker. Ele funciona perfeitamente com os recursos do editor de código do 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.

Publicidade

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

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