Nakon korištenja NPM-a gotovo 8 godina, usput sam naučio stvari za koje bih volio da ih znam kad sam započeo. Nazovimo ih trikovima, stvarima koje su drastično poboljšale moj način rada s NPM-om. Danas želim podijeliti svojih 10 najboljih trikova s vama.
1. Uštedite vrijeme. ⏲ Koristite prečace
Ovo je jedna od najkorisnijih, ali ne tako dobro dokumentiranih značajki. Prečac za naredbu može se činiti trivijalnom stvari, ali istina je da ćete napisati 30-60% manje koda. Uštedjet ćete vrijeme koje možete potrošiti na nešto smisleno, poput ispijanja dodatne šalice kave ☕️?
Umjesto npm install
napiši .npm i
Umjesto npm install--save
napiši .npm i -S
Umjesto npm install--save-dev
napiši .npm i -D
Umjesto npm install--global
napiši .npm i -G
? Bonus prečac! Želite impresionirati svoje kolege? ? Evo ga…
Umjesto npm test
napiši .npm t
2. Instalirajte više paketa u jednu naredbu
Zašto pisati više redaka kad možete napisati jedan? ? Ako svoje pakete znate napamet, najbrža opcija je da ih sve instalirate u jednoslojnu podlogu, ali budite oprezni! Jedan pogrešno napisan paket i cijela naredba neće uspjeti. Ako niste sigurni oko imena, jednostavno ih instalirajte jedno po jedno.
npm i -S react redux react-redux 3. Instalirajte pakete iz različitih izvora
Prema zadanim postavkama, prilikom pokretanja npm-install, NPM će instalirati najnoviju verziju iz npm-registra (//registry.npmjs.org)
Ali ima još toga! NPM može instalirati i pakete iz drugih izvora, poput URL-a ili tarball datoteke.
Kada izrađujete vlastite pakete ili zahtjeve za povlačenje za postojeće pakete, ova je značajka moćna. Na primjer, ako imate vlastitu vilicu Redux, svoj paket možete instalirati izravno iz vilice. (Promijenite usernamesvoje korisničko ime na GitHubu.)
npm i Još bolje, ako koristite spremište GitHub, možete upotrijebiti ovaj prečac:
npm i username/redux
Ima još! Također možete instalirati paket iz određene grane. Korisno tijekom testiranja budućeg izdanja. Samo dodajte #zajedno s nazivom podružnice na kraju.
npm i username/redux#? Bonus prečac! Ne koristite GitHub? Bez brige, postoje i prečaci za BitBucket i GitLab :
npm i bitbucket:username/myrepositorynpm i gitlab:username/myrepository4. Povezivanje paketa
Ponekad želite istodobno raditi na projektu i razvijati njegove pakete. Predavanje i guranje paketa u udaljeno spremište za svaku promjenu koju želite isprobati je zamorno! ? Umjesto toga možete koristiti značajku koja se naziva povezivanje paketa .
Povezivanje paketa funkcionira stvaranjem simboličke veze u vašoj mapi node_modules koja upućuje na lokalno spremište vašeg paketa. Na taj način možete lokalno uređivati pakete i promjene će odmah biti dostupne u projektu pomoću njega.
Najlakši način za razumijevanje povezivanja paketa je isprobavanje!
Recimo da se zove projekt myprojecti zove paket mypackage. Želimo mypackagebiti ovisni od myproject.
Idite u mapu mypackagei napišite
npm linkLijepo! Sada idite u mapu myprojecti napišite
npm link mypackage
Gotovo! Pobliže pogledajte strukturu mapa
Kao što vidite, myproject/node_modules/mypackagesada je simbolična veza do mape mypackage! Sada možete nastaviti razvijati se mypackagei sve promjene koje napravite bit će odmah dostupne u myproject.
5. Naredba npx
Postoji mnogo alata za skriptiranje na NPM-u koje ćete vjerojatno koristiti, ali neće biti dio vašeg runtime snopa. Grunt, gutljaj, reagiraj-stvori-aplikaciju, reagiraj-urodi-kli i moka samo su neki.
Prije NPM 5.x morali ste instalirati ove alate ili kao globalne pakete ili kao devDependencies. To je oduzimalo puno vremena, ne samo za instalaciju, već i za održavanje svih vaših alata za više projekata. Također, većinu alata ćete koristiti samo jednom ili dva puta.
Ovdje binarni NPX dolazi u pomoć i štedi nam puno posla! Na primjer, za pokretanje novog reakcijskog projekta možete jednostavno napisati:
npx create-react-app my-new-project
Najnovija verzija aplikacije create-response-app bit će preuzeta i izvršena odmah. Nema više instaliranja i održavanja alata kao globalnih paketa.
6. Nadgledajte i čistite svoj projekt
Važno je razumjeti što se događa ispod haube prilikom instaliranja paketa kako biste riješili probleme i kako bi stablo ovisnosti i konačna veličina snopa bili što manji.
Prije svega, potreban nam je dobar pregled stabla ovisnosti i koje su verzije paketa zapravo instalirane. Koristite naredbu npm list. Dodajte zastavicu --depth=0na popis samo vrhunskih paketa i dodajte -gna popis svojih globalnih paketa.
npm listnpm list --depth=0 -g
NPM se dobro održava i izravnava stablo ovisnosti u hodu, ali uvijek je dobra navika deduirati svoj projekt prije objavljivanja. Možda će ukloniti nekoliko paketa za vas.
npm dedupe
Također je dobra ideja dobiti dobar pregled zastarjelih i nestalih paketa. Teško je ne voljeti ovaj pogled zbog dobro organiziranih kolumni i božićne vibracije ??
npm outdated
Ako dobijete puno crvenih redaka, morate pokrenuti npm updateda biste svoje pakete ažurirali na najnoviju moguću verziju prema vašem package.json, što je također navedeno u željenom stupcu
npm update
Sjajno! Ako npm oudatedopet trčite , trebali bi nestati svi crveni redovi.
Ako koristite karetu ^ispred svojih verzija u paketu.json, glavne verzije neće biti ažurirane (dakle žuti redovi). Ovo je dobro, jer bi moglo doći do promjena u ažuriranju na novu glavnu verziju.
Ako i dalje želite sve ažurirati na najnoviju verziju, možete koristiti alat npm-update-all. Jednostavno je poput pokretanja ove naredbe u mapi vašeg projekta.
npx npm-update-all
Super! Sada ste dobili najnoviju verziju svih ovisnosti. Ažuriran je i vaš package.json. Budite svjesni kršenja promjena ⚠️
7. Idite na početnu stranicu za paket
Trebate provjeriti dokumentaciju za paket? Zašto se mučiti s prebacivanjem na preglednik i početi guglati kad je sve što trebate terminal? ?
Otvorite spremište za paket u pregledniku
npm repo
Otvorite početnu stranicu
npm home
Otvorite dokumentaciju
npm docs
8. Koristite NPM skripte
Obožavam npm-skripte! Umjesto da koristite pokretače zadataka poput Gulpa i Grunta za automatizaciju ponavljajućih zadataka, u većini slučajeva umjesto nekoliko razloga koristite npm-skripte:
To Manje zavisnosti o razvoju ili globalnih ovisnosti za održavanje.
➕ Nema novih alata za učenje suradnika i članova tima
Manje koda i konfiguracije.
Prije svega, imate unaprijed definirane start, install, test, prepublishtakve skripte koje imaju posebno značenje u NPM-u. O tome kako se oni mogu koristiti možete pročitati u mojem prethodnom vodiču gdje npm-paket gradimo od nule.
Također možete stvoriti vlastite prilagođene skripte. Evo primjera skripte koja će formatirati vaš kôd u srcmapi s ESLintom:
package.json:
"scripts":{"test": "jest","format": "eslint src --fix"}Sada možete trčati npm run formati ESLint će odraditi svoj posao.
Puno stvari možete učiniti s npm-skriptama, poput izvođenja naredbi ljuske i ulančavanja skripti jedna za drugom. Pogledajte npm-skripte za dublje razumijevanje ove moćne značajke.
9. Pokretanje NPM skripti u vsCode
Ponekad u svom paketu.json imam 30 npm-skripti (bez šale). ? Srećom, ako koristite Visual Studio Code, možete sve svoje npm-skripte navesti u istraživaču i pokrenuti svoje skripte klikom na gumb! Svakako omogućite ovu postavku:
npm.enableScriptExplorer: true
10. Postavite zadane vrijednosti
Prilikom stvaranja novog projekta pokretat npm initćete se i postavljat će vam se pitanja o vašem projektu. Da biste uštedjeli vrijeme, vjerojatno ćete napisati run npm init -yza popunjavanje package.json sa zadanim vrijednostima.
Ali koje su točno vaše zadane vrijednosti? ? Neke od njih volim postaviti sam kako bih dalje štedio vrijeme! ?
konfiguracija npm postavljena init.author.name "Carl-Johan (CJ) Kihl"
konfiguracija npm postavljena init.author.email "[email protected]"
Sažetak
To su za sada bili moji savjeti za NPM! Ako imate još savjeta i trikova koje želite podijeliti, dodajte komentar u nastavku! ?
? Bonus prečac!
Zamislite da je petak navečer i spremate se finalizirati novi projekt, ali preumorni ste za pisanje npm dedupe. ?
Bez brige! Snimite tri slova tako što ćete napisati:
npm ddp
Hvala na čitanju.