{"id":232269,"date":"2023-01-11T09:17:00","date_gmt":"2023-01-11T06:17:00","guid":{"rendered":"https:\/\/wordpress.mediadoma.com\/?p=232269"},"modified":"2022-11-10T08:23:22","modified_gmt":"2022-11-10T05:23:22","slug":"kuinka-kaeyttaeae-git-koukkuja-lukitustiedoston-muutosten-havaitsemiseen-ja-viestin-naeyttaemiseen","status":"publish","type":"post","link":"https:\/\/wordpress.mediadoma.com\/fi\/kuinka-kaeyttaeae-git-koukkuja-lukitustiedoston-muutosten-havaitsemiseen-ja-viestin-naeyttaemiseen\/","title":{"rendered":"Kuinka k\u00e4ytt\u00e4\u00e4 Git-koukkuja lukitustiedoston muutosten havaitsemiseen ja viestin n\u00e4ytt\u00e4miseen"},"content":{"rendered":"\n<p>Kun ty\u00f6skentelemme yhteisty\u00f6tiimin parissa, kehitt\u00e4j\u00e4n on aika ajoin lis\u00e4tt\u00e4v\u00e4 haaraan uusi paketti, joka sitten yhdistet\u00e4\u00e4n masteriksi. Joku saattaa olla tiet\u00e4m\u00e4t\u00f6n siit\u00e4 ja vet\u00e4\u00e4 p\u00e4\u00e4llik\u00f6n ja k\u00e4ynnist\u00e4\u00e4 sovelluksen vain, jotta se kaatuu puuttuvan paketin takia. Katsotaanpa, kuinka voimme k\u00e4ytt\u00e4\u00e4 Git-koukkuja havaitaksemme a:n <code>package.json<\/code>tai a :n muutokset <code>yarn.lock<\/code>ja n\u00e4ytt\u00e4\u00e4kseen viestin, joka kehottaa k\u00e4ytt\u00e4j\u00e4\u00e4 asentamaan puuttuvat riippuvuudet.<\/p>\n<h2>Mit\u00e4 ovat Git-koukut?<\/h2>\n<p>Git-koukut laukeavat, kun jokin Git-tapahtuma tapahtuu, kuten uusi sitoumus, sitoumusten ty\u00f6nt\u00e4minen online-haaraan, sitoumusten vet\u00e4minen, haaran tarkistaminen tai haaran yhdist\u00e4minen. N\u00e4m\u00e4 prosessit p\u00e4\u00e4ttyv\u00e4t 0:aan, kun ne p\u00e4\u00e4ttyv\u00e4t oikein, tai johonkin muuhun arvoon, kun ne p\u00e4\u00e4ttyv\u00e4t v\u00e4\u00e4rin.<\/p>\n<p>Jos kiinnitetty prosessi p\u00e4\u00e4ttyy nollaan, Git-toiminto jatkuu. Muussa tapauksessa Git-toiminto estet\u00e4\u00e4n. Jos esimerkiksi m\u00e4\u00e4rit\u00e4t pre-commit Git-koukun yhdist\u00e4m\u00e4\u00e4n koodisi, Git suorittaa t\u00e4m\u00e4n, kun teet <code>git commit<\/code>. Jos nukka ep\u00e4onnistuu, sitoumus ei mene l\u00e4pi.<\/p>\n<p>Git-koukut ovat jotain integroitua Gitiin, ja koukkujen luettelo on eritt\u00e4in laaja. Sinulla on esimerkiksi <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> ja monia muita <a href=\"https:\/\/www.git-scm.com\/docs\/githooks\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">Git-koukkuja<\/a>.<\/p>\n<h2>Suorita Git-koukut Huskyn kanssa<\/h2>\n<p>Joidenkin teht\u00e4vien suorittamiseen Git-koukkujen k\u00e4ynnistyess\u00e4 voimme k\u00e4ytt\u00e4\u00e4 Node.js:n Husky <a href=\"https:\/\/github.com\/typicode\/husky\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">&#8211;<\/a> <a href=\"https:\/\/startfunction.com\/tag\/node-js\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">pakettia<\/a>. Husky antaa meille mahdollisuuden m\u00e4\u00e4ritt\u00e4\u00e4 <code>package.json<\/code>tiedostossa, mitk\u00e4 skriptit suoritetaan, kun Git-koukut laukeavat. Asenna Husky-paketti NPM:ll\u00e4:<\/p>\n<pre><code>npm i -D husky<\/code><\/pre>\n<p>tai lanka:<\/p>\n<pre><code>yarn add -D husky<\/code><\/pre>\n<p>Nyt sinun on alustettava Husky Git-koukkuja varten. Jos k\u00e4yt\u00e4t NPM:\u00e4\u00e4:<\/p>\n<pre><code>npx husky install<\/code><\/pre>\n<p>ja jos k\u00e4yt\u00e4t lankaa<\/p>\n<pre><code>yarn husky install<\/code><\/pre>\n<p>ja siin\u00e4 kaikki, olet nyt asentanut ja m\u00e4\u00e4ritt\u00e4nyt Huskyn suorittamaan Git-koukut. On vihdoin aika m\u00e4\u00e4ritell\u00e4 koukku!<\/p>\n<h2>Lis\u00e4\u00e4 viestien yhdist\u00e4minen Git-koukku tarkistaaksesi lukitustiedoston muutokset<\/h2>\n<p>Haluamme suorittaa jonkin koodin varoittaaksemme, jos <code>package-lock.json<\/code>-tiedostot <code>yarn.lock<\/code>ovat muuttuneet. T\u00e4m\u00e4 tapahtuu yleens\u00e4, kun ved\u00e4mme <code>master<\/code>ja n\u00e4m\u00e4 tiedostot ovat muuttuneet. Voimme asettaa koukun juoksemaan, kun yhdist\u00e4mme haaran.<\/p>\n<p>M\u00e4\u00e4rittelemme Git-koukut Huskyyn m\u00e4\u00e4ritt\u00e4m\u00e4ll\u00e4 ne <code>package.json<\/code>tiedostossa. Lis\u00e4\u00e4 t\u00e4m\u00e4 yl\u00e4tason avaimeksi:<\/p>\n<pre><code>\"husky\": {\n    \"hooks\": {\n      \"post-merge\": \".\/githooks\/post-merge-hook.sh\"\n    }\n}<\/code><\/pre>\n<p>T\u00e4m\u00e4 tarkoittaa, ett\u00e4 kun haara on yhdistetty, suoritamme t\u00e4m\u00e4n skriptin. Meid\u00e4n on nyt luotava se. Luo kansio, lis\u00e4\u00e4 siihen tiedosto ja aseta se suoritettavaksi:<\/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>Jos et m\u00e4\u00e4rit\u00e4 sit\u00e4 suoritettavaksi, saat virheilmoituksen &quot;Lupa estetty&quot;, kun Husky yritt\u00e4\u00e4 suorittaa t\u00e4m\u00e4n Git-koukun. Muokkaa nyt tiedostoa Vimill\u00e4 tai suosikkieditorillasi ja liit\u00e4 se siihen:<\/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>T\u00e4m\u00e4 tulostaa viestin violetilla sanoilla <code>package-lock.json<\/code>ja <code>npm install<\/code>oranssilla. T\u00e4m\u00e4 komentosarja tarkistaa, onko <code>package-lock.json<\/code>se p\u00e4ivitetty, ja jos haluat testata sen <code>yarn.lock<\/code>sijaan, sinun on vain korvattava tiedoston nimi.<\/p>\n<h2>Testaa lukitustiedoston muutostarkistus<\/h2>\n<p>T\u00e4m\u00e4n testaus ei ole liian monimutkaista. Pohjimmiltaan sinun tarvitsee vain luoda uusi haara, asentaa paketti, jotta sit\u00e4 <code>package-lock.json<\/code>muutetaan, sitoa se ja vaihtaa edelliseen haaraan. Kaikki mit\u00e4 voidaan tehd\u00e4 t\u00e4ll\u00e4 komennolla:<\/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>Nyt sinun on yhdistett\u00e4v\u00e4 se t\u00e4h\u00e4n haaraan<\/p>\n<pre><code>git merge testbranch<\/code><\/pre>\n<p>T\u00e4m\u00e4 laukaisee yhdist\u00e4misen j\u00e4lkeisen koukun ja suorittaa skriptimme. N\u00e4et sitten t\u00e4m\u00e4n viestin komentorivill\u00e4, koska sit\u00e4 <code>package-lock.json<\/code>on muokattu yhdist\u00e4misen aikana:<\/p>\n<h2>Lukitustiedoston muutoksen havaitseminen VS-koodissa<\/h2>\n<p>T\u00e4m\u00e4 oli vain yksi k\u00e4ytt\u00f6kerta. Git-koukkuja voidaan k\u00e4ytt\u00e4\u00e4 monin tavoin, esimerkiksi suositun Prettier-paketin suorittamiseen ennen kuin teet jotain koodin muotoiluun.<\/p>\n<p>T\u00e4lle tietylle tapaukselle on olemassa vaihtoehtoja tarkistaa, onko <code>package-lock.json<\/code>p\u00e4ivitetty. Esimerkiksi VS Codessa on n\u00e4pp\u00e4r\u00e4 paketti <a href=\"https:\/\/marketplace.visualstudio.com\/items?itemName=matteopieroni.refresh-npm-packages\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">Refresh NPM Packages<\/a>, joka kehottaa sinua p\u00e4ivitt\u00e4m\u00e4\u00e4n paketit, jos se havaitsee muutoksen. Se toimii riippumatta siit\u00e4, oletko asettanut Git-koukut vai et. Toinen mukava asia on, ett\u00e4 se toimii, kun vaihdat haaraa, jopa yhdist\u00e4m\u00e4tt\u00e4 niit\u00e4 toiseen.<\/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=\"Kuinka k\u00e4ytt\u00e4\u00e4 Git-koukkuja lukitustiedoston muutosten havaitsemiseen ja viestin n\u00e4ytt\u00e4miseen\" ><\/a><\/p>\n<p>T\u00e4ss\u00e4 toteuttamamme etuna on kuitenkin se, ett\u00e4 se suoritetaan komentorivill\u00e4 eik\u00e4 se ole riippuvainen tietyst\u00e4 koodieditorista. Jos ty\u00f6skentelet esimerkiksi avoimen l\u00e4hdekoodin projektissa, saatat haluta m\u00e4\u00e4ritt\u00e4\u00e4 t\u00e4ss\u00e4 kuvatut, jotta kaikilla mukana olevilla kehitt\u00e4jill\u00e4 on yhteinen perusta heid\u00e4n asetuksistaan \u200b\u200briippumatta.<\/p>\n<p><div id=\"PostUnique_PostSource\" style=\"padding-top: 50px\">:  <a target=\"_blank\" rel=\"noopener nofollow\" href=\"\/\/startfunction.com\" class=\"external external_icon\">startfunction.com<\/a><\/div><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Opi havaitsemaan muutokset package-lock.json- tai yarn.lock-tiedostoon ja n\u00e4ytt\u00e4m\u00e4\u00e4n viesti Git-koukkujen ja Huskyn avulla<\/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":[782,750,719,895,771,834,843],"tags":[1166],"class_list":["post-232269","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-avoimen-laehdekoodin-ohjelmisto","category-avoin-laehdekoodi","category-kehittaejae","category-koodi","category-laehteen-ohjaus","category-opas-aloittelijoille","category-opetusohjelmia","tag-affiai-fi"],"_links":{"self":[{"href":"https:\/\/wordpress.mediadoma.com\/fi\/wp-json\/wp\/v2\/posts\/232269","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wordpress.mediadoma.com\/fi\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/wordpress.mediadoma.com\/fi\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/fi\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/fi\/wp-json\/wp\/v2\/comments?post=232269"}],"version-history":[{"count":0,"href":"https:\/\/wordpress.mediadoma.com\/fi\/wp-json\/wp\/v2\/posts\/232269\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/fi\/wp-json\/wp\/v2\/media\/157773"}],"wp:attachment":[{"href":"https:\/\/wordpress.mediadoma.com\/fi\/wp-json\/wp\/v2\/media?parent=232269"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/fi\/wp-json\/wp\/v2\/categories?post=232269"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/fi\/wp-json\/wp\/v2\/tags?post=232269"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}