Anterior

Avançar

Exercício – Resolver conflitos de mesclagem

Concluído

Às vezes, não importa o quão bem você planeja, o projeto dá errado. Imagine que dois desenvolvedores estejam trabalhando no mesmo arquivo de projeto ao mesmo tempo. O primeiro desenvolvedor efetua push de suas alterações para o branch main do repositório do projeto sem nenhum problema. Quando o segundo desenvolvedor tenta efetuar push de suas alterações, o Git diz que há um conflito de mesclagem. O arquivo que o segundo desenvolvedor está tentando modificar não está mais atualizado quanto às alterações mais recentes ou à versão do arquivo. A versão do arquivo deve ser atualizada para que as alterações do segundo desenvolvedor possam ser mescladas. Os desenvolvedores que usam controle de versão temem poucas coisas mais do que o conflito de mesclagem.

Conflitos como esse podem acontecer. Portanto, você deve saber como lidar com eles. A boa notícia é que o Git fornece soluções para lidar com conflitos de mesclagem.

Criar branches para Alice e Bob

Vamos começar criando um branch para Alice e um para Bob. Os dois amigos desenvolvedores estão atualizando arquivos no repositório do projeto ao mesmo tempo. Eles não estão cientes das alterações um do outro porque estão fazendo atualizações em seus branches locais.

1. Verifique se você está no diretório Alice e crie um branch chamado add-cat para Alice trabalhar:

   git checkout -b add-cat
   
   

2. Altere para o diretório Bob e crie um branch chamado style-cat para Bob trabalhar:

   cd ../Bob
   git checkout -b style-cat
   
   

Agora, vamos fazer algumas alterações nos branches.

Faça uma alteração como Alice

Comece assumindo a função de Alice e faça uma alteração na página inicial do site. Substitua a imagem do gato de Bob por uma imagem de Alice.

1. Volte para o diretório Alice:

   cd ../Alice
   
   

2. Se você não baixou os recursos anteriormente, baixe o arquivo zip que contém os recursos desta lição. Descompacte os arquivos de recurso:

   wget https://github.com/MicrosoftDocs/mslearn-branch-merge-git/raw/main/git-resources.zip
   unzip git-resources.zip
   
   

3. Mova o arquivo bombay-cat-180x240.jpg para o diretório Ativos de Alice e exclua os outros arquivos:

   mv bombay-cat-180x240.jpg Assets/bombay-cat-180x240.jpg
   rm git-resources.zip
   rm bobcat2-317x240.jpg
   
   

4. Abra o arquivo index.html e substitua esta instrução (que usa uma das imagens de gato de Bob):

   <img src="Assets/bobcat2-317x240.jpg" />
   

   Por esta instrução (que usa uma das imagens de gato de Alice):

   <img class="cat" src="Assets/bombay-cat-180x240.jpg" />
   

5. Salve o arquivo e feche o editor.

6. Agora, execute os comandos do Git a seguir para efetuar push das alterações para o repositório do projeto. Primeiro, adicionaremos os commits feitos na pasta Ativos. Depois, vamos voltar para o branch main e executar git pull para garantir que nada tenha mudado. Por fim, mesclaremos o branch local add-cat no branch main e efetuaremos push das alterações para o repositório.

   git add Assets
   git commit -a -m "Add picture of Alice's cat"
   git checkout main
   git pull
   git merge --ff-only add-cat
   git push
   
   

Conclua confirmando que o push foi bem-sucedido.

Faça uma alteração como Bob

Sem saber o que Alice está fazendo, Bob observa que o último push de Alice adicionou um estilo CSS chamado cats ao arquivo site.css do repositório. Bob decide aplicar essa classe à imagem de gato dele.

1. Volte para o diretório Bob:

   cd ../Bob
   
   

2. Abra o arquivo index.html . Substitua a instrução que usa a imagem de gato de Bob pela seguinte instrução que adiciona um atributo class="cat" ao elemento <img>:

   <img class="cat" src="Assets/bobcat2-317x240.jpg" />
   

3. Salve o arquivo e feche o editor.

4. Agora, execute os comandos do Git a seguir para sincronizar as alterações com o repositório do projeto, como você fez para as atualizações do repositório de Alice. Confirme a alteração, alterne para o branch main, execute git pull e mescle a alteração de estilo:

   git commit -a -m "Style Bob's cat"
   git checkout main
   git pull
   git merge style-cat
   
   

E aqui está: o temido conflito de mesclagem. A mesma linha no mesmo arquivo foi alterada por duas pessoas. O Git vê o conflito e relata "Falha na mesclagem automática".O Git não tem como saber se o atributo src no elemento <img> deve referenciar o arquivo bobcat2-317x240.jpg ou o arquivo bombay-cat-180x240.jpg.

Auto-merging index.html
CONFLICT (content): Merge conflict in index.html
Automatic merge failed; fix conflicts and then commit the result.

A saída do Git identifica o arquivo index.html como a origem do conflito.

A pergunta agora é: o que Bob deve fazer?

Resolver o conflito de mesclagem

Bob tem algumas opções neste ponto. Ele pode executar uma destas ações:

• Execute o comando git merge --abort para restaurar o branch main para o que era antes da tentativa de mesclagem. Execute o comando git pull para obter as alterações de Alice. Criar um branch, fazer as alterações e mesclar o branch com o branch main. Por fim, efetuar push das alterações.
• Execute o comando git reset --hard para voltar ao local em que estava antes de iniciar a mesclagem.
• Resolver o conflito manualmente usando as informações que o Git insere nos arquivos afetados.

Os desenvolvedores parecem preferir a última opção. Quando o Git detecta um conflito nas versões de conteúdo, ele insere ambas as versões no arquivo. O Git usa formatação especial para ajudar você a identificar e resolver o conflito: colchetes angulares esquerdos <<<<<<<, traços duplos (sinais de igual) ======= e colchetes angulares direitos >>>>>>>. O conteúdo acima da linha de traços ======= mostra as alterações em seu branch. O conteúdo abaixo da linha do separador mostra a versão do conteúdo no branch que você está tentando mesclar.

Confira abaixo como está o arquivo index.html no repositório de Bob agora. Observe a formatação especial em torno do conteúdo com conflitos:

<!DOCTYPE html>
<html>
  <head>
    <meta charset='UTF-8'>
    <title>Our Feline Friends</title>
    <link rel="stylesheet" href="CSS/site.css">
  </head>
  <body>
    <nav><a href="./index.html">home</a></nav>
    <h1>Our Feline Friends</h1>
    <<<<<<< HEAD
    <img class="cat" src="Assets/bombay-cat-180x240.jpg">
    =======
    <img class="cat" src="assets/bobcat2-317x240.jpg">
    >>>>>>> style-cat
    <footer><hr>Copyright (c) 2021 Contoso Cats</footer>
  </body>
</html>

Vamos resolver o conflito de mesclagem editando o arquivo index.html. Como esse conflito de mesclagem é uma correção rápida, você fará a alteração diretamente no branch main, embora ainda esteja no diretório Bob.

1. Abra o arquivo index.html e exclua as linhas de formatação especiais. Não remova nenhuma outra instrução.

   <<<<<<< HEAD
   =======
   >>>>>>> style-cat
   

2. Salve o arquivo e feche o editor.

   O arquivo index.html agora tem dois elementos <img>: um para a imagem de gato de Bob e outro para a imagem de Alice.

   Alguns editores de texto apresentam integração com o Git e oferecem ajuda quando observam texto que indica um conflito de mesclagem. Se você abrir o arquivo index.html no Visual Studio Code, verá o seguinte código:

   

   Se você selecionar Aceitar Ambas as Alterações, o editor removerá as linhas em volta dos elementos <img> e deixará ambos os elementos intactos.

3. Execute os seguintes comandos para confirmar a alteração:

   git add index.html
   git commit -a -m "Style Bob's cat"
   
   

   O comando git add informa ao Git que o conflito no arquivo index.html foi resolvido.

4. Efetue push das alterações para o branch main no repositório remoto:

   git push
   
   

5. Conclua sincronizando as alterações no repositório de Alice:

   cd ../Alice
   git pull
   
   

6. Por fim, abra o arquivo index.html de Alice e confirme se a versão também tem duas tags <img> com fotos de gato.

Continuar