GitHub Actions: Envio de Artefatos de Build

GitBeginner
Pratique Agora

Introdução

Em um pipeline de Integração Contínua (CI), um job frequentemente produz arquivos (como binários compilados, bundles do webpack ou relatórios de teste) que você deseja manter ou compartilhar com outros jobs. Esses arquivos são chamados de artefatos (artifacts).

Por padrão, os arquivos criados durante a execução de um workflow são perdidos quando a execução termina. Para persistir esses arquivos, você precisa "enviá-los" (upload) como artefatos.

Neste laboratório, você modificará seu workflow Node.js para simular um processo de build que cria um diretório dist e, em seguida, usará a action actions/upload-artifact para salvar esse diretório.

Este laboratório baseia-se no repositório que você criou nos laboratórios anteriores. Você trabalhará com o repositório github-actions-demo.

Atualizar o fluxo de trabalho para gerar um arquivo de build

Nesta etapa, você modificará o arquivo de workflow para simular um processo de build. Você adicionará uma etapa que cria um diretório dist e um arquivo artefato fictício (dummy artifact file).

  1. Na página do seu repositório GitHub para github-actions-demo, clique no botão verde Code.
  2. Certifique-se de que a aba HTTPS esteja selecionada e copie a URL. Ela deve ser parecida com https://github.com/your-username/github-actions-demo.git.
  3. Abra o terminal no ambiente LabEx. O caminho padrão é ~/project.
  4. Use o comando git clone para baixar o repositório. Substitua your-username pelo seu nome de usuário real do GitHub.
cd ~/project
git clone https://github.com/your-username/github-actions-demo.git

Exemplo de Saída:

Cloning into 'github-actions-demo'...
remote: Enumerating objects: X, done.
remote: Counting objects: 100% (X/X), done.
remote: Total X (delta 0), reused 0 (delta 0), pack-reused 0
Receiving objects: 100% (X/X), done.
  1. Navegue até o repositório clonado:
cd ~/project/github-actions-demo
  1. Crie um novo arquivo de workflow .github/workflows/upload-artifacts.yml usando o editor WebIDE. Você pode encontrar o arquivo no explorador de arquivos à esquerda, em project/github-actions-demo/.github/workflows/.

  2. Comece criando a estrutura básica do workflow. Adicione o nome do workflow e o gatilho (trigger):

name: Upload Artifacts

on: [push]
  1. Adicione a seção jobs e defina o job de build com seu executor (runs-on):
jobs:
  build:
    runs-on: ubuntu-latest
  1. Adicione a seção steps. Primeiro, adicione a etapa de checkout:
steps:
  - uses: actions/checkout@v4
  1. Adicione a etapa de configuração do Node.js:
- name: Use Node.js
  uses: actions/setup-node@v4
  with:
    node-version: "20"
  1. Adicione a etapa para instalar as dependências:
- name: Install dependencies
  run: npm install
  1. Adicione a etapa de build que cria o diretório dist e um arquivo dentro dele:
- name: Build project
  run: |
    mkdir dist
    echo "This is the build artifact" > dist/build.txt
  1. Adicione a etapa de teste:
- name: Run tests
  run: npm test

Seu arquivo completo deve estar assim agora:

name: Upload Artifacts

on: [push]

jobs:
  build:
    runs-on: ubuntu-latest

    steps:
      - uses: actions/checkout@v4
      - name: Use Node.js
        uses: actions/setup-node@v4
        with:
          node-version: "20"
      - name: Install dependencies
        run: npm install
      - name: Build project
        run: |
          mkdir dist
          echo "This is the build artifact" > dist/build.txt
      - name: Run tests
        run: npm test

Explicação

  • mkdir dist: Cria um diretório chamado dist.
  • echo ... > dist/build.txt: Cria um arquivo de texto simples dentro de dist para simular um asset compilado.

Salve o arquivo (Ctrl+S ou Cmd+S) após fazer as alterações.

Usar actions/upload-artifact@v4 para fazer upload do diretório dist

Agora que produzimos alguns arquivos, precisamos carregá-los (upload). Usaremos a ação oficial actions/upload-artifact.

  1. Em .github/workflows/upload-artifacts.yml, adicione uma nova etapa ao final do job:
- name: Upload build artifact
  uses: actions/upload-artifact@v4
  with:
    name: build-assets
    path: dist
  1. Seu arquivo completo deve se parecer com isto:
name: Upload Artifacts

on: [push]

jobs:
  build:
    runs-on: ubuntu-latest

    steps:
      - uses: actions/checkout@v4
      - name: Use Node.js
        uses: actions/setup-node@v4
        with:
          node-version: "20"
      - name: Install dependencies
        run: npm install
      - name: Build project
        run: |
          mkdir dist
          echo "This is the build artifact" > dist/build.txt
      - name: Run tests
        run: npm test
      - name: Upload build artifact
        uses: actions/upload-artifact@v4
        with:
          name: build-assets
          path: dist

Explicação

  • uses: actions/upload-artifact@v4: Chama a ação para lidar com o upload.
  • name: build-assets: O nome do artefato como ele aparecerá na interface do GitHub (UI).
  • path: dist: O diretório (ou arquivo) a ser carregado.

Salve o arquivo (Ctrl+S ou Cmd+S).

Fazer commit, push e verificar o artefato na UI do GitHub

Nesta etapa, você fará o commit das alterações e as enviará (push) para o GitHub. Isso acionará o workflow que você acabou de atualizar.

  1. Certifique-se de estar no diretório do repositório:
cd ~/project/github-actions-demo
  1. Prepare as alterações (Stage the changes):
git add .
  1. Faça o commit das alterações:
git commit -m "Add build step and upload artifacts"
  1. Envie as alterações para o repositório remoto no GitHub:
git push

Nota sobre Autenticação

Ao executar git push, o WebIDE solicitará automaticamente que você se autentique. Siga estas etapas detalhadas:

  1. Um pop-up aparecerá com a mensagem: "The extension 'GitHub' wants to sign in using GitHub." Clique em Allow.
  2. Uma nova notificação aparecerá. Clique em "Copy&Continue to GitHub" e, em seguida, clique em "Open" no próximo prompt.
  3. Faça login na sua conta do GitHub na janela do navegador que se abrir e insira o código de autorização que foi copiado. Após confirmar a autorização, a página será fechada automaticamente.
  4. Aguarde alguns segundos e você verá o terminal concluir a operação de push com sucesso.

Nota de Privacidade: O WebIDE solicitará acesso total à sua conta do GitHub para fins de autenticação. Você não precisa se preocupar com questões de privacidade - a VM LabEx será imediatamente destruída após a conclusão do laboratório atual, e suas credenciais e informações de autorização não serão retidas.

Este processo de autenticação não requer configuração manual de nome de usuário ou Personal Access Token (Token de Acesso Pessoal).

Verificação no GitHub

  1. Visite seu repositório no GitHub em um navegador da web.
  2. Clique na aba Actions.
  3. Clique na execução de workflow mais recente (por exemplo, "Add build step and upload artifacts").
  4. Role a página de resumo até o final. Você deverá ver uma seção intitulada Artifacts.
  5. Você deverá ver um artefato chamado build-assets.
  6. Clique nele para baixá-lo. Será um arquivo zip contendo build.txt.
GitHub Artifacts

Resumo

Neste laboratório, você aprendeu como persistir dados de uma execução de workflow usando artefatos (artifacts). Você:

  1. Criou uma etapa de "build" que gerou arquivos de saída.
  2. Usou actions/upload-artifact para salvar o diretório dist.
  3. Verificou que o artefato estava disponível para download na UI do GitHub.

Artefatos são essenciais para compartilhar arquivos entre jobs (por exemplo, de um job de build para um job de deploy) ou para depurar falhas enviando logs.