Kuinka käyttää Dependabotia pitämään ympäristösi ajan tasalla

Riippuvuuksien lisääminen projektiin auttaa sinua usein keksimään pyörää uudelleen. Mutta samalla se voi aiheuttaa ongelmia projektin monilla eri puolilla:

  • Versiointi: joskus riippuvuudet voivat vaatia tiettyjä versioita muista riippuvuuksista, mikä voi aiheuttaa hikkaasi sovelluksessasi
  • Niputtaminen: Sinun on oltava varovainen, ettet päätä liikaa ylimääräistä koodia, joka paisuttaa nippujasi
  • Päivittäminen: JavaScript liikkuu nopeasti, ja jos et päivitä paketteja säännöllisesti, pelaat Jengaa tulevaisuudessa.

Riippuvuuksien päivittämistä varten on olemassa erilaisia ​​työkaluja, kuten Dependencies.io, Snyk ja Dependabot. Koska olen käyttänyt Dependabotia jonkin aikaa, päätin kirjoittaa kokemuksestani.

Dependabot on GitHubin vuosi sitten hankkima työkalu, joka tarkistaa riippuvuustiedostot eri kieliltä (Ruby, JavaScript, Python, PHP, Elixir, muutamia mainitakseni) ja löytää uusia versioita kirjastoista, joita käytät projektissasi. Tässä on asennus:

Dependabot-kuvakaappaus

Päivittäiset päivitykset voivat olla ylivoimaisia, ja mielestäni viikoittaisilla päivityksillä on parempi kustannus-hyöty. Lisäksi annan itselleni vetopyynnöt, jotta voin saada ilmoituksia heti, kun ne avataan.

Kuinka käyttää Dependabotia tehokkaasti

Dependabot sisältää jokaisessa PR: ssä julkaisutiedot, muutoslokit, sitoutumislinkit ja haavoittuvuustiedot aina kun ne ovat käytettävissä. Tämä on hyödyllistä, koska voit katsoa tietoja ja päättää jatkaa.

Pragmaattisina ohjelmoijina haluamme kuitenkin varmistaa, että asiat eivät hajoa. PR-yksityiskohdat ovat tärkeitä, mutta haluamme lisäksi, että simuloidaan kaikki projektin (tai melkein kaikki) toimitukset.

CI-integraatio

Tämä kuvakaappaus näyttää, mitä tapahtuu joka kerta, kun PR avataan työmme komponenttikirjastokoodipohjassa.

  • Testit (Jest / Bundle) : Jest-tehtävä testaa React-komponentit, kun taas Bundle-tehtävä simuloi suoritettavia niputuskomentoja, kun haluamme päivittää paketin NPM-rekisterissä
  • Linters (tyylitaulukot / JavaScript) : tyylitaulukotiedostot seuraavat mukautettua sass-lint-asetusta ja JS-koodi seuraa sarjaa ESLint-sääntöjä. Jos PR esittelee uuden version linterista, jossa on uudet säännöt, voimme kaapata sen.
  • Cypress (kuvakaappaustestaus / esteettömyystestaus) : jos uusi paketti tuo muutoksia, jotka saattavat heijastua komponenttien ulkonäköön, Cypress sieppaa eron, kuvastaa sen ja tallentaa S3: een. Koska Cypress tarvitsee live-version dokumentaation verkkosivustosta, saamme myös Gatsbyn rakennusprosessin käsiteltyä.

Kaikissa näissä vaiheissa on erittäin epätodennäköistä, että ulkoinen paketti rikkoo päähaaroitamme. Kiitos työtoverilleni Grant Leen, joka työskentelee myös tässä projektissa.

Lähetetty myös blogiini. Jos pidät tästä sisällöstä, seuraa minua Twitterissä ja GitHubissa. Kansikuva: Zhang Kenny Unsplash-kansiossa