Configurando Git Hooks com Husky

수마리오

  • Introdução
  • O que são Git Hooks?
  • Quando esses Hooks são normalmente disparados?
  • O que é Husky?
  • Instalando o Husky
  • Criando o primeiro Hook com pre-commit
  • Hooks com pre-push
  • Criando o segundo Hook com pre-push
  • Conclusão
  • Olá,pessoas!


    Gostaria de comparitilhar um pouco do que andei estudando sobre Git Hooks com Husky na minha primeira publicaão aqui.
    Antes de tudo,vamos Contextualizer um pouco.

    O que sãO Git Hooks?


    Segundo adocumentação oficial do Git,Git Hooks são:

    Scripts personalizados que podem ser disparados quando alguma ação importante acontece.


    Esses Hooks/Scripts podem ser dispendidos tanto no lado servidor quanto no lado cliente.

    Quando esses Hooks são normalmente Dispedidos?


    고객 없음: quando ocorre alguma opera de commit ou merge.
    서비스 업체가 없음: quando ocorre alguma opera ão de rede(como push,por Examplo).
    만세!
    Vocêpode utilizar esses Hooks para qualquer aèo que julgar important e/ou necessária:)
    pró pria API do Git,por si só,utiliza ão desses Hooks independente de quais technologias est ão sendo utilizadas no projeto를 허용합니다.
    Para projetos que utilizam o ecossitema Node/Npm(seja cliente ou servidor),pode se utilizar oHuskyPara ajudar na configuração desses Hooks.
    Se quiser saber um pouco mais sobre o functionamento desses Hooks por baixo dos panos,recomendoeste artigomaravilhoso doWillian Justen😉

    Ta,mas o queéHusky?


    Éuma raça de cachorros peludos e fofofos🐶
    De acordo com orepositório oficial,Huskyéuma biblioteca JavaScript que serve para previnir péssimos git commit,git push e mais!
    Através do Husky,épossível configurar os Hooks nopackage.jsondo seu projeto e compartilhá-los com seu time.
    Fazendo da forma padrão do Git,as configuraçes dos Hooks ficam dentro do diretório.gitdo projeto(que nãoéversionado),portanto sóvai functiona na sua máquina.
    aaaah,entãoépor isso que utilizamos o Husky!유럽 연합😱 Descobri enquanto liaeste artigodoCubos.io.
    A seguir,vamos ver como adicionar Hooks de pre commit e pre push com o Husky⚡⚡
    Obs:para adicionar o Husky e criar os Hooks,éimportant que vocêpossua um projeto Node/Npm com um arquivopackage.jsone o Git jáinicializado:)

    응, 폴라 파제!


    A primeira A coisa A ser feitaéinstalar o Husky,que deve ficar nas desenvolvimento.
    Para isso,execute o seguinte comando no diretório do seu projeto:
    npm install husky --save-dev
    
    유럽
    yarn add -D husky
    
    Feito isso,vocêvai perceber que uma linha foi adicionada nasdevDependenciesdo seupackage.json,conforme exibido abaixo:
      "devDependencies": {
        ...
        "husky": "^4.2.5"
      }
    
    Vocêpode ver a lista e descripão de todos os Hooks disponíveis nadocumentação oficial(em inglês)ouneste artigodoHostinger(em português)😗✌️
    Rapidamente falando,os Hooks que usaremos são:pre-commit=>éinvocado quando umgit commitéexecutado,antes da escrita do commit.pre-push=>éinvocado quando umgit pushéexecutado,antes de enviar os committes.
    Normalmente,esses Hooks são utilizados para rodar ostesteselintdo projeto,então vamos pegar esses examplos.

    Criando o primeiro Hook com 사전 제출!


    Obs:configuraçes dos Hooks do Husky ficam em Husky。포장이 없어요.json。


    Vamos supor que vocêjátenha umscriptdelintque seja executado comnpm run lint(ouyarn lint)e deseja rodá-lo sempre que o usuário faça umaço de commit,permitindo ou bloqueando a escrita deste commit.
    Neste caso,basta chamar onpm run lint(ouyarn lint)no Hook depre-commitdo Husky,conforme Examplicado abaixo:
    {
      "name": "my-project",
      "scripts": {
        ...
        "lint": "eslint . --ext .js,.jsx"
      },
      "devDependencies": {
        ...
        "husky": "^4.2.5"
      }
      "husky": {
        "hooks": {
          "pre-commit": "npm run lint"
        }
      }
    }
    
    Caso queira adicionar outroscriptpara ser executado nopre-commit,basta adicioná-lo na frente donpm run lintcom um&&entre eles.
    예:
      "husky": {
        "hooks": {
          "pre-commit": "npm run lint && npm run test"
        }
      }
    
    플로티니오!Com isso,os doisscriptsserão executados quando alguém tentar fazer umcommitno projeto😊

    O Problem 미리 밀어넣기


    Como comentado anteriormente,opre-pushserve para executar umscriptantes de alguém fazer umpushno projeto.
    Mas、pesquisando um pouco sobre opre-push、me deparei comeste artigodoKacper Wdowik.
    Basicamente,ele diz que nem sempre opre-pushéuma boa ideia,examplicando isso com a execuão dos testes do projeto.
    Aconteche que,normalmente,ao rodarnpm run testélevado em consideraão todos os arquivos modificados localmente no projeto;ou seja,considera arquivos/linhas que ainda não foram“commitados”.
    A dor que ele sentiu foi em relaçoácoerència e concord–ncia dos testes com o que está,de fato,subindo.Um caso não tão incomum seria os testes passarem porque Um arquivo foi corrigido mas não estános arquivos para subir com opush,o que poderia resultar em Um erro em produão numa sexta feiraánoite,por examplo👀
    Para resolver isso,ele fez uso da seguinte abordagem:comparo que estánoHEADdo projeto com o que estáem local,permitindo que aço depushseja realizada apenas quando a pessoa realizoucommitsde todos os arquivos modificados,garantdo que o Hook rode com os arquivos que vão,de fato,subir.
    엔토오 워커템 두아스 작품:

  • Permitir que as pessoas desenvolvedoras façampushquando alguma linha ou arquivo não esteja“commitado”,sabendo que oscriptexecutado nopre-pushpode não estar em concord–ncia com o que está,de fato,subido;

  • 저항que as pessoas desenvolvedoras fa çampushquando alguma linha ou arquivo n ão esteja'commitado'e tera confian ça de que oscriptexecutado nopre-pushesteja em cord-ncia com oque est á, de fato,subindo.
  • 유럽연합,pessoalmente,prefiro a segunda opão,mas isso vai de cada projeto😊

    Criando o o segundo Hook com


    Como comentado acima,vou seguir com a segunda abordagem,indo de acordo com o estudo doKacper Wdowikno artigoWhy using pre-push Git Hooks with Husky is not always a good idea.
    Ficaria algo assim:
    {
      "name": "my-project",
      "scripts": {
        ...
        "lint": "eslint . --ext .js,.jsx",
        "test": "npm run jest"
      },
      "devDependencies": {
        ...
        "husky": "^4.2.5"
      }
      "husky": {
        "hooks": {
          "pre-commit": "npm run lint",
          "pre-push": "git diff HEAD --quiet && npm run test && npm run lint"
        }
      }
    }
    
    acima의 예가 없습니다. oHEADestásendocomparidocomasuaárvoredetrabalhoatual.Caso sejam iguais,continua a execuço.Caso contrário,termina execuço Retronando um erro.
    Utilizando esta Abodagem,caso tente rodar umgit pushcom arquivos modificados apenas localmente(sem“commitar”),vocêpode se deparar com uma mensage de erro semelhante a esta:

    Caso isso aconteça,não siga a orientaço dele de adicionar um--no-verifyao executar ogit push,pois assim o Hook vai ser ignorado e seu esforço seráem vão😅
    por'commitar'를 modifica öes e refarize a opera ão depushou seguir pela primeira abodagem comentada l á emcima(removendogit diff HEAD --quiet &&로 선택합니다.
    Feito isso,seus Hooks de commit e push jávão estar funcionando para todo mundo que mexer no projeto:D

    결론


    제랄은 없습니다. os Git Hooks com Husky tendem a ficar mais simples e gerenci á veis,permitindo que mais de uma pessoa tenha acesso ás mesmas reglas.
    Dei Examplos simples de implementaão,chamandoscriptsjáexistentes no seu projeto.Mas vocêpode criar seus própriosscriptsmanualmente e chamá-los nos Hooks.
    falarum pouco sobre a cria ão descriptsmanualmente em um artigo futuro,focado unicamente neste ponto,que tende a ser um pouco mais complexo e deixaria este artigo muito longo xD
    Além do que foi falado aqui,recomendo o uso dolint-stagedpara facilitar a organizaço e visualizaço dosscriptsdelintexecutados nos Hooks do Husky.
    Se quiser saber um pouco mais sobre as vantagens de utilizaão dolint-staged,recomendoeste artigoincrível daEvellyn Lima,onde ela fala sobre otimizaão dopre-commite mostra exemplos práticos comlint-staged.
    아, lembre se que o Git possui vários Hooks que podem ser utilizados e cabe a voc êdecidir quais Hooks fazem sentido(ou n ão) para aplicar no Workflow do seu projeto😉
    Qualquer d úvida, sugest ão, corre ão, coment ário 등, me procure no ou no, que estou sempre dispon ível✌️

    좋은 웹페이지 즐겨찾기