{"id":232410,"date":"2023-01-11T09:30:00","date_gmt":"2023-01-11T06:30:00","guid":{"rendered":"https:\/\/wordpress.mediadoma.com\/?p=232410"},"modified":"2022-11-10T09:18:30","modified_gmt":"2022-11-10T06:18:30","slug":"come-utilizzare-gli-hook-git-per-rilevare-le-modifiche-a-un-file-di-blocco-e-mostrare-un-messaggio","status":"publish","type":"post","link":"https:\/\/wordpress.mediadoma.com\/it\/come-utilizzare-gli-hook-git-per-rilevare-le-modifiche-a-un-file-di-blocco-e-mostrare-un-messaggio\/","title":{"rendered":"Come utilizzare gli hook Git per rilevare le modifiche a un file di blocco e mostrare un messaggio"},"content":{"rendered":"\n<p>Quando lavoriamo in un team collaborativo, di tanto in tanto uno sviluppatore deve aggiungere un nuovo pacchetto a un ramo che viene poi unito al master. Qualcuno potrebbe non esserne a conoscenza e semplicemente estrarre master ed eseguire l&#8217;app solo per farla arrestare in modo anomalo a causa del pacchetto mancante. Vediamo come possiamo utilizzare gli hook Git per rilevare le modifiche a <code>package.json<\/code>o a <code>yarn.lock<\/code>e visualizzare un messaggio che richiede all&#8217;utente di installare le dipendenze mancanti.<\/p>\n<h2>Cosa sono gli hook Git?<\/h2>\n<p>Gli hook Git vengono attivati \u200b\u200bquando si verifica un evento Git come un nuovo commit, il push di commit su un ramo online, pull commit, checkout di un ramo o unione di un ramo. Questi processi terminano con 0 quando terminano correttamente o con un altro valore quando terminano in modo errato.<\/p>\n<p>Se il processo agganciato termina con 0, l&#8217;azione Git procede. In caso contrario, l&#8217;azione Git viene bloccata. Ad esempio, se configuri un hook Git pre-commit per lint il tuo codice, Git lo eseguir\u00e0 quando esegui un <code>git commit<\/code>. Se il lint fallisce, il commit non andr\u00e0 a buon fine.<\/p>\n<p>Gli hook Git sono qualcosa di integrato in Git e l&#8217;elenco degli hook \u00e8 molto ampio. Ad esempio, hai <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 molti altri <a href=\"https:\/\/www.git-scm.com\/docs\/githooks\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">hook Git<\/a>.<\/p>\n<h2>Esegui Git hook con Husky<\/h2>\n<p>Per eseguire alcune attivit\u00e0 quando gli hook Git vengono attivati, possiamo utilizzare il <a href=\"https:\/\/github.com\/typicode\/husky\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">pacchetto Husky<\/a> per <a href=\"https:\/\/startfunction.com\/tag\/node-js\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">Node.js<\/a>. Husky ci consente di specificare in un <code>package.json<\/code>file quali script eseguire quando viene attivato un hook Git. Installa il pacchetto Husky con NPM:<\/p>\n<pre><code>npm i -D husky<\/code><\/pre>\n<p>o Filato:<\/p>\n<pre><code>yarn add -D husky<\/code><\/pre>\n<p>Ora devi inizializzare Husky per gli hook Git. Se usi NPM:<\/p>\n<pre><code>npx husky install<\/code><\/pre>\n<p>e se usi Filato<\/p>\n<pre><code>yarn husky install<\/code><\/pre>\n<p>e il gioco \u00e8 fatto, ora hai installato e configurato Husky per eseguire gli hook Git. \u00c8 finalmente arrivato il momento di definire un gancio!<\/p>\n<h2>Aggiungi un hook Git post-unione per controllare le modifiche ai file di blocco<\/h2>\n<p>Vogliamo eseguire del codice per avvisarci se i file <code>package-lock.json<\/code>o <code>yarn.lock<\/code>sono cambiati. Questo accade di solito quando estraiamo <code>master<\/code>e questi file sono cambiati. Possiamo impostare un hook da eseguire quando uniamo un ramo.<\/p>\n<p>Per specificare i nostri hook Git su Husky li definiamo nel <code>package.json<\/code>file. Aggiungi questo come chiave di livello superiore:<\/p>\n<pre><code>\"husky\": {\n    \"hooks\": {\n      \"post-merge\": \".\/githooks\/post-merge-hook.sh\"\n    }\n}<\/code><\/pre>\n<p>Ci\u00f2 che dice \u00e8 che dopo aver unito un ramo, eseguiremo questo script. Ora dobbiamo crearlo. Crea una cartella, aggiungi un file e impostalo come eseguibile:<\/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 non lo imposti per essere eseguibile, ti imbatterai in un errore &quot;Autorizzazione negata&quot; quando Husky tenta di eseguire questo hook Git. Ora modifica il file con Vim o il tuo editor preferito e incollalo al suo interno:<\/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>Questo stamper\u00e0 un messaggio in viola con le parole <code>package-lock.json<\/code>e <code>npm install<\/code>in arancione. Questo script controlla se <code>package-lock.json<\/code>\u00e8 stato aggiornato e se vuoi provare <code>yarn.lock<\/code>invece dovrai semplicemente sostituire il nome del file.<\/p>\n<h2>Testare il controllo di modifica del file di blocco<\/h2>\n<p>Testare questo non \u00e8 troppo complesso. Fondamentalmente devi solo creare un nuovo ramo, installare un pacchetto in modo che <code>package-lock.json<\/code>venga modificato, eseguirne il commit e passare al ramo precedente. Tutto ci\u00f2 che pu\u00f2 essere fatto con questo 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>Ora devi unirlo a questo ramo<\/p>\n<pre><code>git merge testbranch<\/code><\/pre>\n<p>Questo attiver\u00e0 l&#8217;hook post-unione ed eseguir\u00e0 il nostro script. Vedrai quindi questo messaggio nella riga di comando perch\u00e9 <code>package-lock.json<\/code>\u00e8 stato modificato durante l&#8217;unione:<\/p>\n<h2>Rilevamento di una modifica del file di blocco in VS Code<\/h2>\n<p>Questo era solo un uso. Gli hook Git possono essere usati in molti modi, ad esempio, per eseguire il popolare pacchetto Prettier prima di eseguire il commit di qualcosa per formattare il codice.<\/p>\n<p>Ci sono alternative per questo caso particolare, di verificare se <code>package-lock.json<\/code>\u00e8 stato aggiornato. Ad esempio, per VS Code c&#8217;\u00e8 un bel pacchetto <a href=\"https:\/\/marketplace.visualstudio.com\/items?itemName=matteopieroni.refresh-npm-packages\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">Aggiorna pacchetti NPM<\/a> che ti chieder\u00e0 di aggiornare i tuoi pacchetti se rileva una modifica. Verr\u00e0 eseguito indipendentemente dal fatto che tu abbia impostato o meno gli hook Git. Un&#8217;altra cosa bella \u00e8 che funzioner\u00e0 quando cambi ramo, anche senza fonderne uno nell&#8217;altro.<\/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=\"Come utilizzare gli hook Git per rilevare le modifiche a un file di blocco e mostrare un messaggio\" ><\/a><\/p>\n<p>Tuttavia, il vantaggio di ci\u00f2 che abbiamo implementato qui \u00e8 che verr\u00e0 eseguito nella riga di comando e non dipende da un particolare editor di codice. Se stai lavorando, ad esempio, su un progetto open source, potresti voler impostare ci\u00f2 che \u00e8 descritto qui in modo che ci sia un terreno comune per tutti gli sviluppatori coinvolti indipendentemente dalla loro configurazione.<\/p>\n<p><div id=\"PostUnique_PostSource\" style=\"padding-top: 50px\">Fonte di registrazione:  <a target=\"_blank\" rel=\"noopener nofollow\" href=\"\/\/startfunction.com\" class=\"external external_icon\">startfunction.com<\/a><\/div><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Scopri come rilevare le modifiche a un file package-lock.json o yarn.lock e mostrare un messaggio utilizzando Git hook 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":[896,772,835,751,783,720,844],"tags":[1168],"class_list":["post-232410","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-codice","category-controllo-della-fonte","category-guida-per-principianti","category-open-source-projektmanagement-3","category-software-open-source","category-sviluppatore","category-tutorial","tag-affiai-it"],"_links":{"self":[{"href":"https:\/\/wordpress.mediadoma.com\/it\/wp-json\/wp\/v2\/posts\/232410","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wordpress.mediadoma.com\/it\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/wordpress.mediadoma.com\/it\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/it\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/it\/wp-json\/wp\/v2\/comments?post=232410"}],"version-history":[{"count":0,"href":"https:\/\/wordpress.mediadoma.com\/it\/wp-json\/wp\/v2\/posts\/232410\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/it\/wp-json\/wp\/v2\/media\/157773"}],"wp:attachment":[{"href":"https:\/\/wordpress.mediadoma.com\/it\/wp-json\/wp\/v2\/media?parent=232410"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/it\/wp-json\/wp\/v2\/categories?post=232410"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/it\/wp-json\/wp\/v2\/tags?post=232410"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}