Forstå avhengighet i reaktinære indianske

Avhengighet er eksterne biblioteker eller moduler som prosjektet ditt er avhengig av for å legge til funksjonalitet, strømlinjeforme utvikling eller forbedre ytelsen. I React Native, blir avhengighet vanligvis administreres via npm eller garn ⁇ JavaScript pakke ledere som håndterer bibliotek installasjon, oppdateringer, versjonskontroll og noen ganger til og med hjemmekode kobling. I motsetning til en standard web app, React Native prosjekter ofte pakke JavaScript avhengigheter sammen med innfødte avhengigheter (iOS CocoaPods, Android Gradle filer), gjør avhengighetshåndtering mer nyansert.

Avhengighet faller i to kategorier:

  • JavaScript avhengigheter ⁇ rene JS-biblioteker (f.eks. ], ) som fungerer uten innfødt konfigurasjon.
  • Native avhengigheter] ⁇ biblioteker som krever brogning til hjemmelaget kode (f.eks. ], ]). Disse trenger ofte ytterligere oppsettssteg som ] eller manuelle Gradle endringer.

React Native-dokumentasjonen gir detaljer om å starte et prosjekt og dets standardavhengighetstre.

Installere avhengigheter

Hvis du vil legge til et nytt bibliotek i React Native-prosjektet, kan du bruke installasjonskommandoen til pakkehåndteringen. For eksempel, for å installere react-navigasjon, kjører du:

npm install @react-navigation/native @react-navigation/stack

eller med garn:

yarn add @react-navigation/native @react-navigation/stack

Etter installasjonen krever noen biblioteker kobling av hjemmebygd kode. I React Native 0.60+, automatisk kobling håndterer de fleste hjemmehørende avhengigheter. Imidlertid krever visse biblioteker (spesielt de med egendefinerte innfødte visninger eller tredjepart SDKs) fortsatt manuelle trinn:

  • For iOS: kjøre eller å installere CocoaPods pods.
  • For Android: bibliotekets blir automatisk slått sammen, men du må kanskje legge til et arkiv eller endre hvis bibliotekets React Native-pakke ikke er autoregistrert.

Kontroller alltid bibliotekets installasjonsguide ⁇ mange populære biblioteker etter ⁇ installer trinn for å unngå kjøringstid krasjer.

Bruker npx reakt-native lenke (Legacy)

For prosjekter som bruker React Native < 0.60, må du manuelt koble innfødte avhengigheter med . Denne kommandoen endrer din Podfil og/eller . Hvis du opprettholder et arvelig prosjekt, bør du vurdere å overføre til auto-kobling med .

Sparing avhengighet

Som standard lagrer npm og garn installerte pakker til din pakke.json fil under eller seksjonen. Dette holder styr på alle avhengigheter og deres versjonsområder, noe som sikrer at andre utviklere eller distribusjonsmiljøer kan installere det samme settet pakker med én kommando ( eller ).

Når du installerer en pakke uten eksplisitt å markere den som en dev avhengighet, lagres den under ]. For verktøy som bare brukes under utvikling (f.eks. ], ], ), bruk:

npm install --save-dev package-name
yarn add --dev package-name

Ved å opprettholde en klar separasjon mellom løps- og dev-avhengigheter reduseres pakkestørrelsen i produksjonen og forhindrer utilsiktet innkludering av bygg-tid verktøy i appbutikkarkivet.

Håndtering av avhengighetsversjoner

Oppgi nøyaktige versjoner i pakke.json bidrar til å hindre uventede problemer forårsaket av oppdateringer. Du kan bruke semantisk versjon (semper) til å kontrollere oppdateringer:

  • ⁇ aksepterer en mindre eller lappeversjon over 1.0.0 (f.eks. 1.1.0, 1.25, men ikke 2.0.0.
  • ⁇ aksepterer bare oppdateringsversjoner over 1.0.0 (f.eks. 1.0.1, 1.0.0, 1.09) men ikke 1.1.1.0.
  • ⁇ festet til nøyaktig versjon 1.0.0 (ingen oppdateringer).

For produksjonsapplikasjoner, stift direkte avhengighetene dine til nøyaktige versjoner (f.eks. ]) for å unngå utilsiktet å bryte endringer under distribusjon. Bruk en låsefil (] eller ]) for å garantere at hver installasjon produserer identiske trær.

Løsning av versjonskonflikter

Når to biblioteker krever ulike versjoner av samme pakke, kan du møte peer avhengighet advarsler eller kjøretid feil. Verktøy for å løse konflikter:

  • npm ls pakkenavn ⁇ viser avhengighetstreet og fremhever duplekser.
  • yarn hvorfor pakkenavn] - forklarer hvorfor en pakke er installert.
  • npm dedupe / ]yarn-dedupleks] ⁇ flatt dupliserte pakker der det er mulig.

For React Native, gi ekstra oppmerksomhet til motstridende versjoner av , eller opprinnelige moduler som ]. Inkonsekvente versjoner kan forårsake kryptiske feil som «Native modul kan ikke finnes.»

Oppdaterer avhengighet

Vanlig oppdatering av avhengigheter er avgjørende for sikkerhet, ytelse og tilgang til nye funksjoner. Bruk følgende tilnærminger:

  • Minor/Patch oppdateringer: ] eller ] ⁇ trygt for ikke-brekkende endringer.
  • Feil oppdateringer: manuelt støte på versjonen i ] og kjøre . Se gjennom bibliotekets endringslogg for å bryte API-endringer.
  • Interaktiv oppgradering: bruk (installert separat) for å se hvilke pakker som har nyeste versjoner, deretter selektivt oppdatere.

Når du oppdaterer kjernen React Native selv (] pakke), alltid følge den offisielle React Native oppgradering guide] og bruk for å slå sammen endringer i prosjektets malfiler. Test grundig på både iOS og Android simulatorer og ekte enheter etter en større oppdatering.

Automatisering av oppdateringer med CI/CD

I en kontinuerlig integrasjonsrørledning, sette opp en jobb som kjører eller periodisk, skaper en trekkforespørsel om mindre oppdateringer, og utløser full test suiter. Dette hindrer avhengighetsrot mens du opprettholder et stabilt miljø.

Fjerne ubrukte avhengigheter

Når et bibliotek ikke lenger brukes, fjerne det for å redusere buntstørrelse og forenkle vedlikehold:

npm uninstall library-name
yarn remove library-name

Ubrukte pakker kan holde seg i selv etter fjerning hvis de var transitive avhengigheter. Kjør eller for å slette ekstrautstyr. For en mer grundig opprydding, vurdere:

  • depcheck ⁇ et verktøy som identifiserer ubrukte avhengigheter i kodebasen din.
  • npx reagerer-native unlink bibliotek-navn (legacy) ⁇ fjerner alle innfødte linking artefakter.

Beste praksis for avhengighetsledelse

  • Regulært gjennomgang og oppdatering av avhengigheter. Planlegger en månedlig \"avhengighetsrevisjon\" ⁇ sjekk for sikkerhetsrådgivere (]), oppdater til nyeste stabile versjoner og rydde opp foreldede pakker.
  • Hold avhengighetene til det minste som kreves. Unngå “kittsjen-svank” biblioteker; velg fokuserte, velholdte alternativer (f.eks. ] for ikoner i stedet for å importere et helt UI-sett).
  • Bruk semantisk versjon for å kontrollere oppdateringer. Pinn store versjoner og stole på låsefiler for reproducerbarhet.
  • Test grundig etter oppdatering av avhengigheter. Kjør enhetstester, integrasjonstester og manuell UI-testing på begge plattformene. Vær oppmerksom på endret hjemmemoduladferd.
  • Hold fast ved en ren og låsefiler. Unngå manuelle redigeringer som kan introdusere uoverensstemmelser. Legg til eller for å gi versjonskontrollen samme installasjoner på tvers av miljøer.
  • Prefergarn over npm hvis du trenger deterministiske installasjoner og arbeidsområder. Garn Berry (v2+) tilbyr Plug'n'Play, som kan fremskynde installasjoner, men kan kreve kompatibilitetskontroller med React Native.
  • Bruk ] til å diagnostisere vanlige avhengighets- og miljøproblemer før feilsøking.

Håndtering av de lokale avhengighetene med cocoaPods og Gradle

For iOS, alltid forplikte til å låse versjonene av innfødte pods. Kjør ] når du oppgraderer et React Native-bibliotek for å få den nyeste kompatible pod-versjonen. For Android, forsikre deg om at ikke har motstridende eller verdier på tvers av biblioteker.

Bruke monorepos med reakt-inde

Hvis prosjektet ditt bruker en monorepo (f.eks. Nx, Turborepo, Lerna), administrerer avhengigheter på rotnivå med arbeidsområder. Vær forsiktig med heising ⁇ noen React Native biblioteker kan kreve alternativer for å unngå transitive avhengighetskonflikter.

Vanlige brudd og hvordan å unngå dem

  • “Kan ikke finne modul” feil etter npm installasjon: Slett , og kjøre ny installasjon. Hvis du bruker garn, slette så vel (men vær forsiktig med låsefiler).
  • iOS-bygget mislykkes etter å ha lagt til et bibliotek: Sørg for at du kjørte og at bibliotekets podfil er riktig referert. Kontroller Xcode-bygglogger for «bibliotek som ikke ble funnet» feil.
  • Android kjøretid krasj på grunn av manglende hjemmehørende modul: Kontroller at bibliotekets Android-pakke er auto - registrert eller at du manuelt legger til sin i ].
  • Dupliserer symbol eller metodekonflikter: Bruk og løser motstridende hjemmekoder ved å oppgradere eller nedgradere et av bibliotekene.

Eksterne ressurser

Effektiv avhengighetsledelse bidrar til å holde React Native-prosjektet trygt, effektivt og vedlikeholdbart. Etter disse praksisene vil effektivisere utviklingen, redusere potensielle problemer forårsaket av utdaterte eller inkompatible biblioteker, og la teamet ditt fokusere på å bygge funksjoner i stedet for å kjempe avhengighet helvete.