{"id":232274,"date":"2023-01-11T09:38:00","date_gmt":"2023-01-11T06:38:00","guid":{"rendered":"https:\/\/wordpress.mediadoma.com\/?p=232274"},"modified":"2022-11-10T08:25:06","modified_gmt":"2022-11-10T05:25:06","slug":"como-usar-os-ganchos-do-git-para-detectar-alteracoes-em-um-arquivo-de-bloqueio-e-mostrar-uma-mensagem","status":"publish","type":"post","link":"https:\/\/wordpress.mediadoma.com\/pt-pt\/como-usar-os-ganchos-do-git-para-detectar-alteracoes-em-um-arquivo-de-bloqueio-e-mostrar-uma-mensagem\/","title":{"rendered":"Como usar os ganchos do Git para detectar altera\u00e7\u00f5es em um arquivo de bloqueio e mostrar uma mensagem"},"content":{"rendered":"\n<p>Quando estamos trabalhando em uma equipe colaborativa, de tempos em tempos um desenvolvedor precisa adicionar um novo pacote a um branch que \u00e9 ent\u00e3o mesclado ao master. Algu\u00e9m pode n\u00e3o saber disso e apenas puxar o master e executar o aplicativo apenas para que ele falhe devido ao pacote ausente. Vamos ver como podemos usar os ganchos do Git para detectar altera\u00e7\u00f5es em a <code>package.json<\/code>ou a <code>yarn.lock<\/code>e exibir uma mensagem solicitando que o usu\u00e1rio instale as depend\u00eancias ausentes.<\/p>\n<h2>O que s\u00e3o ganchos do Git?<\/h2>\n<p>Os ganchos do Git s\u00e3o acionados quando ocorre algum evento do Git, como um novo commit, push de commits para um branch online, pull commits, check-out de um branch ou merge de um branch. Esses processos terminam com 0 quando terminam corretamente ou algum outro valor quando terminam incorretamente.<\/p>\n<p>Se o processo hooked terminar com 0, a a\u00e7\u00e3o do Git continua. Caso contr\u00e1rio, a a\u00e7\u00e3o do Git \u00e9 bloqueada. Por exemplo, se voc\u00ea configurar um gancho Git pr\u00e9-commit para fazer o lint do seu c\u00f3digo, o Git executar\u00e1 isso quando voc\u00ea fizer um arquivo <code>git commit<\/code>. Se o lint falhar, o commit n\u00e3o ser\u00e1 conclu\u00eddo.<\/p>\n<p>Os hooks do Git s\u00e3o algo integrado ao Git e a lista de hooks \u00e9 bem extensa. Por exemplo, voc\u00ea tem <a href=\"https:\/\/www.git-scm.com\/docs\/githooks#_pre_push\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">pre-push<\/a>, <a href=\"https:\/\/www.git-scm.com\/docs\/githooks#_post_commit\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">post-commit<\/a>, <a href=\"https:\/\/www.git-scm.com\/docs\/githooks#_post_checkout\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">post-checkout<\/a>, <a href=\"https:\/\/www.git-scm.com\/docs\/githooks#_post_merge\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">post-merge<\/a> e muitos outros <a href=\"https:\/\/www.git-scm.com\/docs\/githooks\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">ganchos do Git<\/a>.<\/p>\n<h2>Execute os ganchos do Git com o Husky<\/h2>\n<p>Para executar algumas tarefas quando os hooks do Git s\u00e3o acionados, podemos usar o pacote <a href=\"https:\/\/github.com\/typicode\/husky\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">Husky<\/a> para <a href=\"https:\/\/startfunction.com\/tag\/node-js\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">Node.js.<\/a> O Husky nos permite especificar em um <code>package.json<\/code>arquivo quais scripts devem ser executados quando um gancho do Git \u00e9 acionado. Instale o pacote Husky com NPM:<\/p>\n<pre><code>npm i -D husky<\/code><\/pre>\n<p>ou Fio:<\/p>\n<pre><code>yarn add -D husky<\/code><\/pre>\n<p>Agora voc\u00ea precisa inicializar os ganchos do Husky para Git. Se voc\u00ea usa NPM:<\/p>\n<pre><code>npx husky install<\/code><\/pre>\n<p>e se voc\u00ea usar o fio<\/p>\n<pre><code>yarn husky install<\/code><\/pre>\n<p>e pronto, agora voc\u00ea instalou e configurou o Husky para executar hooks do Git. Finalmente \u00e9 hora de definir um gancho!<\/p>\n<h2>Adicione um gancho Git post merge para verificar as altera\u00e7\u00f5es do arquivo de bloqueio<\/h2>\n<p>Queremos executar algum c\u00f3digo para nos alertar se os arquivos <code>package-lock.json<\/code>ou <code>yarn.lock<\/code>foram alterados. Isso geralmente acontece quando puxamos <code>master<\/code>e esses arquivos foram alterados. Podemos configurar um gancho para ser executado quando mesclarmos uma ramifica\u00e7\u00e3o.<\/p>\n<p>Para especificar nossos ganchos do Git para o Husky, n\u00f3s os definimos no <code>package.json<\/code>arquivo. Adicione isto como uma chave de n\u00edvel superior:<\/p>\n<pre><code>\"husky\": {\n    \"hooks\": {\n      \"post-merge\": \".\/githooks\/post-merge-hook.sh\"\n    }\n}<\/code><\/pre>\n<p>O que isso diz \u00e9 que depois que uma ramifica\u00e7\u00e3o for mesclada, executaremos esse script. Agora temos que cri\u00e1-lo. Crie uma pasta, adicione um arquivo a ela e configure-a para ser execut\u00e1vel:<\/p>\n<pre><code>mkdir githooks &amp;&amp; cd githooks &amp;&amp; touch post-merge-hook.sh &amp;&amp; chmod +x post-merge-hook.sh<\/code><\/pre>\n<p>Se voc\u00ea n\u00e3o configur\u00e1-lo para ser execut\u00e1vel, voc\u00ea encontrar\u00e1 um erro &quot;Permiss\u00e3o negada&quot; quando o Husky tentar executar este gancho do Git. Agora edite o arquivo com o Vim ou seu editor favorito e cole isso nele:<\/p>\n<pre><code>\nchangedFiles=\"$(git diff-tree -r --name-only --no-commit-id ORIG_HEAD HEAD)\"\n\nrunOnChange() {\n    echo \"$changedFiles\" | grep -q \"$1\" &amp;&amp; echo -e \"$2\"\n}\n\nrunOnChange package-lock.json \"033[35m*******************************************************************************n* 033[33mpackage-lock.json033[35m has changed. Run033[33m npm install033[35m to update your dependencies. *n*******************************************************************************\"\n\nexit 0\n<\/code><\/pre>\n<p>Isso imprimir\u00e1 uma mensagem em roxo com as palavras <code>package-lock.json<\/code>e <code>npm install<\/code>em laranja. Este script verifica se <code>package-lock.json<\/code>foi atualizado e, se voc\u00ea quiser testar <code>yarn.lock<\/code>, basta substituir o nome do arquivo.<\/p>\n<h2>Testar a verifica\u00e7\u00e3o de altera\u00e7\u00e3o do arquivo de bloqueio<\/h2>\n<p>Testar isso n\u00e3o \u00e9 muito complexo. Basicamente, voc\u00ea s\u00f3 precisa criar uma nova ramifica\u00e7\u00e3o, instalar algum pacote para que <code>package-lock.json<\/code>seja modificado, confirm\u00e1-lo e mudar para a ramifica\u00e7\u00e3o anterior. Tudo o que pode ser feito com este comando:<\/p>\n<pre><code>git checkout -b testbranch &amp;&amp; npm i -D lint-staged &amp;&amp; git add. &amp;&amp; git commit -m \"test\" &amp;&amp; git checkout - <\/code><\/pre>\n<p>Agora voc\u00ea precisa mescl\u00e1-lo neste branch<\/p>\n<pre><code>git merge testbranch<\/code><\/pre>\n<p>Isso acionar\u00e1 o gancho post-merge e executar\u00e1 nosso script. Voc\u00ea ver\u00e1 esta mensagem na linha de comando porque <code>package-lock.json<\/code>foi modificado durante a mesclagem:<\/p>\n<h2>Detectando uma altera\u00e7\u00e3o no arquivo de bloqueio no VS Code<\/h2>\n<p>Este foi apenas um uso. Os ganchos do Git podem ser usados \u200b\u200bde v\u00e1rias maneiras, por exemplo, para executar o pacote popular Prettier antes de voc\u00ea confirmar algo para formatar seu c\u00f3digo.<\/p>\n<p>Existem alternativas para este caso espec\u00edfico, de verificar se <code>package-lock.json<\/code>foi atualizado. Por exemplo, para o VS Code, h\u00e1 um pacote bacana <a href=\"https:\/\/marketplace.visualstudio.com\/items?itemName=matteopieroni.refresh-npm-packages\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">Atualizar pacotes NPM<\/a> que solicitar\u00e1 que voc\u00ea atualize seus pacotes se detectar uma modifica\u00e7\u00e3o. Ele ser\u00e1 executado independentemente de voc\u00ea ter configurado hooks do Git ou n\u00e3o. Outra coisa legal \u00e9 que funcionar\u00e1 quando voc\u00ea trocar de branches, mesmo sem mesclar um deles no outro.<\/p>\n<p><a href=\"https:\/\/wordpress.mediadoma.com\/wp-content\/uploads\/2022\/01\/post-157772-61e6c09a98d0e.png\" data-rel=\"lightbox\"><img decoding=\"async\" class=\"SDStudio-light-box-enable SDStudio-editor-tools-md-imp\" src=\"https:\/\/wordpress.mediadoma.com\/wp-content\/uploads\/2022\/01\/post-157772-61e6c09a98d0e.png\" alt=\"Como usar os ganchos do Git para detectar altera\u00e7\u00f5es em um arquivo de bloqueio e mostrar uma mensagem\" ><\/a><\/p>\n<p>No entanto, a vantagem do que implementamos aqui \u00e9 que ele ser\u00e1 executado na linha de comando e n\u00e3o depende de um editor de c\u00f3digo espec\u00edfico. Se voc\u00ea estiver trabalhando, por exemplo, em um projeto de c\u00f3digo aberto, conv\u00e9m configurar o que est\u00e1 descrito aqui para que haja um terreno comum para todos os desenvolvedores envolvidos, independentemente de sua configura\u00e7\u00e3o.<\/p>\n<p><div id=\"PostUnique_PostSource\" style=\"padding-top: 50px\">Fonte de grava\u00e7\u00e3o:  <a target=\"_blank\" rel=\"noopener nofollow\" href=\"\/\/startfunction.com\" class=\"external external_icon\">startfunction.com<\/a><\/div><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Saiba como detectar altera\u00e7\u00f5es em um arquivo package-lock.json ou yarn.lock e mostrar uma mensagem usando ganchos do Git e Husky<\/p>\n","protected":false},"author":1,"featured_media":157773,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":"","_wp_rev_ctl_limit":""},"categories":[898,753,722,774,837,785,846],"tags":[1170],"class_list":["post-232274","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-codigo-2","category-codigo-aberto","category-desenvolvedor","category-fonte-de-controle","category-guia-para-iniciantes","category-software-livre","category-tutoriais","tag-affiai-pt-pt"],"_links":{"self":[{"href":"https:\/\/wordpress.mediadoma.com\/pt-pt\/wp-json\/wp\/v2\/posts\/232274","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wordpress.mediadoma.com\/pt-pt\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/wordpress.mediadoma.com\/pt-pt\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/pt-pt\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/pt-pt\/wp-json\/wp\/v2\/comments?post=232274"}],"version-history":[{"count":0,"href":"https:\/\/wordpress.mediadoma.com\/pt-pt\/wp-json\/wp\/v2\/posts\/232274\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/pt-pt\/wp-json\/wp\/v2\/media\/157773"}],"wp:attachment":[{"href":"https:\/\/wordpress.mediadoma.com\/pt-pt\/wp-json\/wp\/v2\/media?parent=232274"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/pt-pt\/wp-json\/wp\/v2\/categories?post=232274"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/pt-pt\/wp-json\/wp\/v2\/tags?post=232274"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}