Frontend Lerna: Monorepo valdymo įvaldymas globalioms kūrėjų komandoms

Šiandieninėje sparčiai besivystančioje programinės įrangos kūrimo aplinkoje sudėtingų frontend projektų valdymas gali kelti didelių iššūkių, ypač geografiškai išsibarsčiusioms komandoms. Tradicinis požiūris, kai palaikoma daug nepriklausomų saugyklų, gali lemti kodo dubliavimąsi, nenuoseklias priklausomybes ir fragmentuotą kūrimo patirtį. Būtent čia monorepo galia, kartu su efektyviais valdymo įrankiais, tokiais kaip Lerna, išties atsiskleidžia. Šis išsamus vadovas gilinsis į „frontend Lerna“, nagrinės jo privalumus, praktinį diegimą ir geriausią praktiką, skirtą optimizuoti jūsų kūrimo darbo srautus ir skatinti sklandų bendradarbiavimą jūsų globalioje komandoje.

Kas yra Monorepo?

Monorepo, trumpinys nuo monolitinės saugyklos, yra programinės įrangos kūrimo strategija, kai daugelio skirtingų projektų kodas saugomas toje pačioje versijų kontrolės saugykloje. Tai priešinga polyrepo metodui, kai kiekvienas projektas yra atskiroje saugykloje.

Nors monorepo koncepcija egzistuoja jau kurį laiką, jos taikymas pastaraisiais metais smarkiai išaugo, ypač didelėse organizacijose ir projektuose, kurie dalijasi bendromis priklausomybėmis ar funkcionalumu. „Frontend“ kūrimui monorepo gali talpinti kelias nepriklausomas programas, bendrinamas komponentų bibliotekas, įrankių paketus ir netgi backend paslaugas, visa tai – vienoje saugyklos struktūroje.

Kodėl verta rinktis Monorepo „Frontend“ kūrimui?

„Monorepo“ strategijos pranašumai „frontend“ projektams yra daugybė ir gali žymiai paveikti kūrėjų produktyvumą, kodo kokybę ir bendrą projekto palaikomumą. Štai keletas pagrindinių privalumų:

• Supaprastintas priklausomybių valdymas: Priklausomybių valdymas keliose saugyklose gali būti košmaras. Monorepo aplinkoje priklausomybes galite perkelti į aukščiausią lygį, užtikrindami, kad būtų įdiegta ir bendrinama viena kiekvienos priklausomybės versija visuose paketuose. Tai drastiškai sumažina „priklausomybių pragarą“, dažnai pasitaikantį „polyrepo“ nustatymuose.
• Atominiai įsipareigojimai ir refaktoringas: Pokyčiai, apimantys kelis projektus, gali būti įdiegti atomiškai. Tai reiškia, kad vienas įsipareigojimas gali atnaujinti bendrinamas bibliotekas ir visas jas naudojančias programas vienu metu, užtikrinant nuoseklumą ir išvengiant integravimo problemų. Didelio masto refaktoringas tampa žymiai lengvesnis ir mažiau klaidų keliantis.
• Kodo dalijimasis ir pakartotinis naudojimas: Monorepos natūraliai skatina dalytis kodu. Bendrinamos komponentų bibliotekos, pagalbinių funkcijų ir dizaino sistemos gali būti lengvai kuriamos ir naudojamos keliuose toje pačioje saugykloje esančiuose projektuose, skatinant nuoseklumą ir mažinant dubliavimąsi.
• Supaprastinta kūrimo patirtis: Turėdami vieną tiesos šaltinį, kūrėjai gali lengvai naršyti ir dirbti su skirtingomis kodo bazės dalimis. Įrankiai, integruoti su monorepo, gali suprasti ryšius tarp paketų, įgalindami tokias funkcijas kaip kryžminis paketų susiejimas ir optimizuotas kūrimas.
• Nuoseklūs įrankiai ir konfigūracija: Užtikrinti nuoseklius kūrimo įrankius, linterius, formatatorius ir testavimo sistemas visuose projektuose tampa paprasta. Tai lemia vienodesnę kūrimo aplinką ir sumažina kūrėjų kognityvinę apkrovą.
• Lengvesnis bendradarbiavimas globalioms komandoms: Tarptautinėms komandoms, dirbančioms skirtingose laiko juostose, monorepo suteikia vieną, prieinamą visų kodo tiesos tašką. Tai sumažina koordinavimo naštą ir užtikrina, kad visi dirba su naujausiomis bendrinamo kodo versijomis.

Pristatome Lerna: Jūsų Monorepo palydovas

Nors „monorepo“ koncepcija yra galinga, efektyviam jų valdymui reikalingi specializuoti įrankiai. Būtent čia pasirodo Lerna. Lerna yra populiari įrankių grandinė, skirta valdyti „JavaScript“ projektus su keliais paketais. Ji padeda jums valdyti ir publikuoti paketus jūsų „monorepo“ saugykloje, užtikrinant nuoseklų versijavimą ir supaprastinant atnaujinimų publikavimo procesą.

Lerna sprendžia keletą pagrindinių iššūkių, būdingų monorepo valdymui:

• Paketų atradimas ir valdymas: Lerna automatiškai aptinka paketus jūsų monorepo, leidžiant vykdyti komandas visuose arba jų pogrupyje.
• Priklausomybių susiejimas: Jis automatiškai susieja vietinius paketus monorepo viduje, kad paketai galėtų priklausyti vienas nuo kito, nereikalaujant jų pirmiausia paskelbti registre.
• Versijavimas: Lerna suteikia lanksčias versijavimo strategijas, leidžiančias valdyti versijas nepriklausomai arba sinchroniškai visuose paketuose.
• Publikavimas: Jis supaprastina atnaujintų paketų publikavimo procesą į npm registrus, tvarkant versijų didinimą ir pakeitimų žurnalo generavimą.

Frontend Monorepo nustatymas naudojant Lerna

Panagrinėkime esminius žingsnius, kaip nustatyti „frontend monorepo“ naudojant Lerna. Darysime prielaidą, kad turite „Node.js“ ir „npm“ (arba „Yarn“) įdiegtus globaliai.

1. Naujos Lerna saugyklos inicijavimas

Pirmiausia sukurkite naują katalogą savo „monorepo“ ir inicijuokite jį su Lerna:

            mkdir my-frontend-monorepo
cd my-frontend-monorepo
lerna init

            

              
                Copy
              
            
          

Ši komanda sukurs pagrindinį Lerna konfigūracijos failą (lerna.json) ir nustatys packages katalogą, kuriame bus saugomi jūsų individualūs paketai.

2. Pasirinkite savo paketų tvarkyklę

Lerna palaiko tiek „npm“, tiek „Yarn“. Savo pasirinkimą galite sukonfigūruoti lerna.json faile. Pavyzdžiui, norėdami naudoti „Yarn“:

            {
  "packages": [
    "packages/*"
  ],
  "version": "0.0.0",
  "npmClient": "yarn",
  "useWorkspaces": true
}

            

              
                Copy
              
            
          

Nustačius useWorkspaces: true naudojant „Yarn“ arba „npm“ v7+, pasinaudojama integruotomis darbo aplinkos funkcijomis, kurios gali dar labiau optimizuoti priklausomybių diegimą ir susiejimą. Jei naudojate „npm“ v7+, įsitikinkite, kad esate įsipareigoję package-lock.json arba npm-shrinkwrap.json failus.

3. Sukurkite pirmuosius Frontend paketus

Kataloge packages galite sukurti pakatalogius savo individualiems „frontend“ projektams ar bibliotekoms. Sukurkime bendrinamą UI komponentų biblioteką ir paprastą žiniatinklio programą.

            mkdir packages/ui-components
mkdir packages/web-app

            

              
                Copy
              
            
          

Dabar pereikite į kiekvieną naują paketo katalogą ir inicijuokite naują npm/Yarn paketą:

            cd packages/ui-components
yarn init -y
# Or npm init -y

cd ../web-app
yarn init -y
# Or npm init -y

            

              
                Copy
              
            
          

Faile packages/ui-components/package.json galite apibrėžti kai kuriuos pagrindinius UI komponentus. Faile packages/web-app/package.json apibrėšite savo programos priklausomybes.

4. Paketų susiejimas su Lerna

Kad jūsų web-app priklausytų nuo ui-components, galite naudoti Lerna komandinės eilutės sąsają.

Pirmiausia įsitikinkite, kad jūsų lerna.json tinkamai sukonfigūruotas paketų atradimui:

            {
  "packages": [
    "packages/*"
  ],
  "version": "0.0.0",
  "npmClient": "yarn",
  "useWorkspaces": true
}

            

              
                Copy
              
            
          

Dabar, iš savo monorepo šakninio katalogo, paleiskite:

            lerna add @my-monorepo/ui-components --scope=@my-monorepo/web-app

            

              
                Copy
              
            
          

Pastaba: Pakeiskite @my-monorepo/ui-components ir @my-monorepo/web-app savo tikraisiais paketų pavadinimais, apibrėžtais atitinkamuose package.json failuose. Turėsite atnaujinti lauką name kiekvieno paketo package.json faile, kad atspindėtų šią aprėptį.

Lerna automatiškai sukurs reikiamas simbolines nuorodas. Jei naudojate „Yarn Workspaces“ arba „npm Workspaces“, jums gali prireikti sukonfigūruoti workspaces lauką savo šakniniame package.json faile:

root/package.json
{
  "name": "my-frontend-monorepo",
  "private": true,
  "workspaces": [
    "packages/*"
  ]
}

Sukonfigūravus darbo sritis, Lerna komanda `add` gali elgtis šiek tiek kitaip, labiau pasikliaudama pagrindinio paketų tvarkyklės darbo srities susiejimu. Paleidus `yarn install` arba `npm install` šakniniame kataloge, susiejimas dažnai bus tvarkomas automatiškai, kai darbo sritys bus nustatytos.

5. Komandų vykdymas per paketus

Lerna puikiai tinka vykdyti komandas keliuose paketuose. Pavyzdžiui, norėdami paleisti visus paketus (įdiegti priklausomybes ir jas susieti):

            lerna bootstrap

            

              
                Copy
              
            
          

Norėdami paleisti scenarijų, apibrėžtą kiekvieno paketo package.json faile (pvz., build scenarijų):

            lerna run build

            

              
                Copy
              
            
          

Taip pat galite paleisti komandas konkretiems paketams:

            lerna run build --scope=@my-monorepo/web-app

            

              
                Copy
              
            
          

Arba išskirti konkrečius paketus:

            lerna run build --no-private --exclude=@my-monorepo/ui-components

            

              
                Copy
              
            
          

Išplėstinės Lerna funkcijos globalioms komandoms

Be pagrindinių funkcijų, Lerna siūlo savybes, kurios ypač naudingos globalioms kūrėjų komandoms:

6. Versijavimo strategijos

Lerna siūlo dvi pagrindines versijavimo strategijas:

• Fiksuotas versijavimas (numatytasis): Visi „monorepo“ paketai turi vieną versiją. Atnaujinus versiją, ji taikoma visiems paketams. Tai idealu projektams, kuriuose pakeitimai tarp paketų yra glaudžiai susiję.
• Nepriklausomas versijavimas: Kiekvienas paketas gali turėti savo nepriklausomą versiją. Tai naudinga, kai paketai yra labiau laisvai susiję ir gali būti atnaujinami bei išleidžiami skirtingu laiku.

Tai galite sukonfigūruoti lerna.json faile:

            {
  // ... other settings
  "version": "1.0.0" // For fixed versioning
}

            

              
                Copy
              
            
          

Arba įjungti nepriklausomą versijavimą:

            {
  // ... other settings
  "version": "independent"
}

            

              
                Copy
              
            
          

Naudojant nepriklausomą versijavimą, Lerna paragins jus nurodyti, kurie paketai pasikeitė ir kuriuos reikia atnaujinti versijas publikavimo operacijos metu.

7. Paketų publikavimas

Lerna supaprastina paketų publikavimą į „npm“ ar kitus registrus.

Pirmiausia įsitikinkite, kad jūsų paketai sukonfigūruoti su atitinkamais package.json failais (įskaitant pavadinimą, versiją ir galbūt publishConfig privatiems paketams ar apibrėžties paketams).

            lerna publish

            

              
                Copy
              
            
          

Lerna patikrins, kurie paketai pasikeitė nuo paskutinio publikavimo, paragins jus padidinti versijas (jei tai nėra automatizuota), o tada juos publikuos. Taip pat galite automatizuoti versijų atnaujinimą ir pakeitimų žurnalo generavimą, naudodami tokius įrankius kaip conventional-changelog.

Tarptautinėms komandoms, publikuojančioms į privačius „npm“ registrus (pvz., „Azure Artifacts“, „GitHub Packages“ ar „Artifactory“), įsitikinkite, kad jūsų CI/CD konvejeris sukonfigūruotas su tinkamais autentifikavimo žetonais ir registrų URL adresais.

8. Nuolatinė integracija ir nuolatinis diegimas (CI/CD)

Lerna integravimas su jūsų CI/CD konvejeriu yra labai svarbus automatizuojant kūrimą, testavimą ir diegimą.

Pagrindiniai CI/CD aspektai Lerna monorepo:

• Talpyklos naudojimas: Talpinkite node_modules katalogą ir kūrimo artefaktus, kad pagreitintumėte kūrimo laiką.
• Selektyvus kūrimas: Sukonfigūruokite savo CI taip, kad būtų kuriami ir testuojami tik tie paketai, kurie faktiškai pasikeitė nurodytame įsipareigojime. Įrankiai, tokie kaip lerna changed arba lerna run --affected, gali padėti identifikuoti pasikeitusius paketus.
• Palyginimas: Pasinaudokite Lerna galimybe vykdyti komandas lygiagrečiai, kad pagreitintumėte CI užduotis.
• Publikavimo strategija: Apibrėžkite aiškias taisykles, kada ir kaip paketai publikuojami, ypač nepriklausomam versijavimui. Apsvarstykite galimybę naudoti Git žymas, kad inicijuotumėte publikavimą.

CI/CD darbo eigos ištraukos pavyzdys (konceptualus):

# ... setup Node.js environment ...

# Install dependencies using the package manager configured in lerna.json
RUN yarn install --frozen-lockfile # or npm ci

# Run linters and tests on changed packages
RUN lerna run lint --stream --affected
RUN lerna run test --stream --affected

# Build packages
RUN lerna run build --stream --affected

# If changes detected and configured to publish, run publish
# Consider using specific GitHub Actions or GitLab CI jobs for publishing
# RUN lerna publish from-git --yes

Globalinėms komandoms įsitikinkite, kad jūsų CI/CD paleidėjai yra geografiškai paskirstyti arba sukonfigūruoti taip, kad sumažintų vėlavimą kritiniams kūrimo ir diegimo žingsniams.

Geriausios praktikos „Frontend Lerna Monorepo“ naudojimui

Siekiant maksimaliai išnaudoti „Lerna monorepo“ privalumus ir užtikrinti sklandžią patirtį jūsų globalioje komandoje, apsvarstykite šias geriausias praktikas:

9. Nuoseklios pavadinimų konvencijos

Priimkite nuoseklią paketų pavadinimų konvenciją, dažnai naudodami apibrėžties pavadinimus (pvz., @my-company/ui-components, @my-company/auth-service). Tai pagerina aiškumą ir organizavimą, ypač didesniuose monorepo projektuose.

10. Aiškios paketų ribos

Nors „monorepo“ skatina dalintis kodu, svarbu išlaikyti aiškias ribas tarp paketų. Venkite kurti glaudų susiejimą, kai pakeitimai viename pakete lemia plačius pakeitimus kituose, nebent tai yra numatytas dizainas (pvz., pamatinė biblioteka).

11. Centralizuotas kodo analizavimas ir formatavimas

Naudokite Lerna, kad užtikrintumėte nuoseklias kodo analizavimo ir formatavimo taisykles visuose paketuose. Įrankius, tokius kaip ESLint, Prettier ir Stylelint, galima konfigūruoti šakniniame lygyje ir vykdyti per Lerna komandas, siekiant užtikrinti kodo kokybę ir vienodumą.

Pavyzdys:

            lerna run lint --parallel
lerna run format --parallel

            

              
                Copy
              
            
          

Naudojant --parallel galima žymiai pagreitinti šias operacijas daugelyje paketų.

12. Efektyvios testavimo strategijos

Įdiekite patikimą testavimo strategiją. Galite paleisti testus visiems paketams naudodami lerna run test. CI optimizavimui sutelkite dėmesį į testų vykdymą tik tiems paketams, kurie pasikeitė.

Apsvarstykite galimybę nustatyti galo iki galo (E2E) testus programoms ir vieneto/integracijos testus bendrinamoms bibliotekoms. Globaliai paskirstytoms komandoms įsitikinkite, kad jūsų testavimo infrastruktūra gali valdyti galimą tinklo delsą arba regioninius skirtumus, jei taikoma.

13. Dokumentacija ir komunikacija

Naudojant „monorepo“, aiški dokumentacija yra nepaprastai svarbi. Įsitikinkite, kad kiekviename pakete yra README, paaiškinantis jo paskirtį, naudojimo būdą ir konkrečias nustatymo instrukcijas. Išlaikykite centrinį README „monorepo“ šakninėje dalyje, kuriame aprašoma bendra projekto struktūra ir gairės naujiems prisidėjusiems asmenims.

Reguliarus komandos narių bendravimas, ypač dėl reikšmingų pakeitimų bendrinamuose paketuose ar architektūrinių sprendimų, yra gyvybiškai svarbus siekiant išlaikyti nuoseklumą skirtinguose regionuose.

14. Šiuolaikinių „Frontend“ įrankių panaudojimas

Šiuolaikinės „frontend“ sistemos ir kūrimo įrankiai dažnai gerai palaiko „monorepo“. Pavyzdžiui:

• Webpack/Vite: Gali būti sukonfigūruoti efektyviai sujungti kelias programas „monorepo“ viduje.
• React/Vue/Angular: Komponentų bibliotekos, sukurtos naudojant šias sistemas, gali būti lengvai valdomos ir bendrinamos.
• TypeScript: Naudokite TypeScript tipų saugumui visame „monorepo“, su konfigūracijomis, kurios atsižvelgia į paketų ribas.

Tokie įrankiai kaip „Turborepo“ ir „Nx“ populiarėja kaip pažangesnės „monorepo“ kūrimo sistemos, siūlančios tokias funkcijas kaip išmanusis talpinimas ir nuotolinis vykdymas, kurios gali dar labiau padidinti našumą, ypač dideliuose „monorepo“ projektuose.

Iššūkiai ir svarstymai

Nors Lerna ir „monorepo“ siūlo didelių privalumų, svarbu žinoti apie galimus iššūkius:

• Pradinės sąrankos sudėtingumas: „Monorepo“ nustatymas gali būti sudėtingesnis nei pradžia su individualiomis saugyklomis, ypač kūrėjams, naujiems šiai koncepcijai.
• Kūrimo laikas: Be tinkamo optimizavimo, didelių „monorepo“ kūrimo laikas gali tapti ilgas. Svarbu pasinaudoti Lerna lygiagrečiu vykdymu ir išbandyti pažangias kūrimo sistemas.
• Įrankių suderinamumas: Užtikrinkite, kad jūsų pasirinkti įrankiai (linters, formatters, bundlers) būtų suderinami su „monorepo“ struktūromis.
• Versijų kontrolės našumas: Ypač dideliems „monorepo“ su plačia įsipareigojimų istorija, Git operacijos gali sulėtėti. Tokios strategijos kaip seklūs klonai arba Git LFS gali padėti tai sušvelninti.
• Mokymosi kreivė: Kūrėjams gali prireikti laiko prisitaikyti prie „monorepo“ darbo eigos ir suprasti, kaip Lerna valdo paketus ir priklausomybes.

Alternatyvos ir papildomi įrankiai

Nors Lerna yra galingas įrankis, egzistuoja ir kitų sprendimų, kurie gali papildyti arba pasiūlyti alternatyvų monorepo valdymui:

• Yarn Workspaces: Kaip minėta, „Yarn“ integruota darbo aplinkos funkcija puikiai tinka priklausomybių valdymui ir susiejimui „monorepo“ sistemose.
• npm Workspaces: Nuo „npm“ v7, „npm“ taip pat apima tvirtą darbo aplinkos palaikymą.
• Nx: Labai griežta kūrimo sistema, skirta „monorepo“ projektams, teikianti pažangias funkcijas, tokias kaip priklausomybių grafiko analizė, išmanusis talpinimas ir paskirstytas užduočių vykdymas, dažnai pranokstanti Lerna našumu dideliuose projektuose.
• Turborepo: Panašiai kaip Nx, Turborepo yra dar viena didelio našumo kūrimo sistema, skirta „JavaScript monorepo“ projektams, orientuota į greitį ir efektyvų talpinimą.

Daugelis komandų naudoja „Yarn“/„npm“ darbo sritis pagrindinei monorepo struktūrai, o po to – Lerna (arba „Nx“/„Turborepo“) pažangioms funkcijoms, tokioms kaip publikavimas ir versijavimas.

Išvada

„Frontend Lerna“ yra tvirtas ir lankstus sprendimas „JavaScript monorepo“ valdymui, suteikiantis kūrėjų komandoms, ypač toms, kurios pasklidusios po visą pasaulį, efektyvius darbo srautus, supaprastintą priklausomybių valdymą ir patobulintą kodo dalijimąsi. Supratę Lerna galimybes ir laikydamiesi geriausių praktikų, galite supaprastinti savo kūrimo procesą, pagerinti kodo kokybę ir puoselėti bendradarbiavimo aplinką, skatinančią inovacijas.

Augant jūsų projektų sudėtingumui ir jūsų komandai plečiantis įvairiuose regionuose, „monorepo“ strategijos, valdomos Lerna (arba papildomais įrankiais), priėmimas gali tapti strateginiu pranašumu. Tai leidžia sukurti labiau suderintą kūrimo patirtį, sumažina pridėtines išlaidas ir galiausiai leidžia jūsų globaliai komandai efektyviau teikti aukštos kokybės „frontend“ programas.

Pagrindinės išvados globalioms komandoms:

• Standartizuoti: Naudokite Lerna, kad užtikrintumėte nuoseklius įrankius ir kodo standartus.
• Bendradarbiauti: Pasinaudokite atominiais įsipareigojimais ir lengvu kodo dalijimusi geresnei komandos sinergijai.
• Optimizuoti: Integruokite Lerna su CI/CD, kad automatizuotumėte ir efektyviai kurtumėte bei diegtumėte.
• Bendrauti: Palaikykite aiškią dokumentaciją ir atvirus komunikacijos kanalus.

Įvaldę Lerna savo „frontend monorepo“, investuojate į mastelį palaikančią ir tvarią kūrimo infrastruktūrą, kuri gali palaikyti jūsų komandos augimą ir sėkmę globaliu mastu.