Šie NPM triki padarīs jūs par profesionāli

Pēc NPM izmantošanas gandrīz 8 gadus esmu iemācījies lietas, kuras vēlos zināt, kad sāku. Sauksim tos par trikiem, lietām, kas krasi uzlaboja manu darba veidu ar NPM. Šodien es vēlos dalīties ar jums savos top 10 trikos.

1. Ietaupiet laiku. ⏲ ​​Izmantojiet saīsnes

Šī ir viena no visnoderīgākajām, bet ne tik labi dokumentētajām funkcijām. Komandas īsceļš var šķist niecīga lieta, bet patiesība ir tāda, ka jūs uzrakstīsit par 30–60% mazāk koda. Jūs ietaupīsiet laiku, ko varat tērēt kaut kam jēgpilnam, piemēram, izdzerot papildu tasi kafijas ☕️?

Tā vietā npm install

rakstīt .npm i

Tā vietā npm install--save

rakstīt .npm i -S

Tā vietā npm install--save-dev

rakstīt .npm i -D

Tā vietā npm install--global

rakstīt .npm i -G

? Bonusa saīsne! Vai vēlaties pārsteigt savus kolēģus? ? Šeit tas nāk ...

Tā vietā npm test

rakstīt .npm t

2. Vienā komandā instalējiet vairākus paketes

Kāpēc rakstīt vairākas rindas, ja varat rakstīt vienu? ? Ja jūs zināt savus iepakojumus no galvas, ātrākais variants ir tos visus instalēt vienā līnijpārvadātājā, taču esiet piesardzīgs! Viena kļūdaini uzrakstīta pakete un visa komanda neizdosies. Ja neesat pārliecināts par nosaukumiem, vienkārši instalējiet tos pa vienam.

npm i -S react redux react-redux 

3. Instalējiet pakotnes no dažādiem avotiem

Pēc noklusējuma, palaižot npm-install, NPM instalēs jaunāko versiju no npm- register (//registry.npmjs.org)

Bet tur ir vairāk! NPM var instalēt paketes arī no citiem avotiem, piemēram, URL vai tarball faila.

Veidojot savus paketes vai pieprasot esošos paketes, šī funkcija ir efektīva. Piemēram, ja jums ir sava Redux dakša, varat instalēt paketi tieši no dakšas. ( GitHub nomainiet usernamesavu lietotājvārdu.)

npm i 

Vēl labāk, ja izmantojat GitHub repozitoriju, varat izmantot šo saīsni:

npm i username/redux

Tur ir vairāk! Jūs varat arī instalēt paketi no konkrētas filiāles. Noderīgi, pārbaudot nākotnes laidienu. Vienkārši pievienojiet #kopā ar filiāles nosaukumu beigās.

npm i username/redux#

? Bonusa saīsne! Vai jūs neizmantojat GitHub? Neuztraucieties, ir arī BitBucket un GitLab saīsnes :

npm i bitbucket:username/myrepositorynpm i gitlab:username/myrepository

4. Paku sasaiste

Dažreiz jūs vēlaties strādāt pie projekta un vienlaikus izstrādāt tā paketes. Nododot paketi un virzot to uz attālo repozitoriju par visām izmaiņām, kuras vēlaties izmēģināt, ir apnicīgi! ? Tā vietā jūs varat izmantot funkciju, ko sauc par paketes saistīšanu .

Pakotnes saistīšana darbojas, mapē node_modules izveidojot simbolu saiti, kas norāda uz pakotnes vietējo krātuvi. Tādā veidā jūs varat rediģēt paketes lokāli, un izmaiņas būs uzreiz pieejamas projektā, izmantojot to.

Vienkāršākais veids, kā saprast pakotņu saistīšanu, ir izmēģināt!

Pieņemsim, ka mums ir projekts ar nosaukumu myprojectun pakete mypackage. Mēs vēlamies mypackagebūt atkarīgi no myproject.

Dodieties uz mapi mypackageun rakstiet

npm link

Jauki! Tagad dodieties uz mapi myprojectun rakstiet

npm link mypackage

Gatavs! Apskatiet mapju struktūru tuvāk

Kā redzat, myproject/node_modules/mypackagetagad ir saite uz mapi mypackage! Tagad jūs varat turpināt attīstīties, mypackageun visas veiktās izmaiņas būs uzreiz pieejamas myproject.

5. Npx komanda

NPM ir daudz skriptu rīku, kurus jūs, iespējams, izmantosiet, taču neietilpsit izpildlaika komplektā. Grunt, rīt, reaģēt-izveidot-app, reaģēt-native-cli un mocha ir tikai daži.

Pirms NPM 5.x šie rīki bija jāinstalē vai nu kā globālās paketes, vai kā devDependencies. Tas bija laikietilpīgi, ne tikai instalējot, bet arī uzturot visus rīkus vairākiem projektiem. Turklāt lielāko daļu rīku izmantosiet tikai vienu vai divas reizes.

Lūk, binārais NPX nāk talkā un ietaupa mums daudz darba! Piemēram, lai sāktu jaunu reaģēšanas projektu, varat vienkārši uzrakstīt:

npx create-react-app my-new-project

Tūlīt tiks lejupielādēta un izpildīta jaunākā Create-Reago-app versija. Vairs nevajadzēs instalēt un uzturēt rīkus kā globālas paketes.

6. Uzraugiet un notīriet savu projektu

Instalējot paketes, ir svarīgi saprast, kas notiek zem pārsega, lai atrisinātu problēmas un lai atkarības koks un galīgais saišķa lielums būtu pēc iespējas mazāks.

Pirmkārt, mums ir nepieciešams labs pārskats par atkarības koku un to, kuras pakotnes versijas faktiski ir instalētas. Izmantojiet komandu npm list. Pievienojiet karodziņu --depth=0tikai visaugstākā līmeņa pakotņu -gsarakstam un pievienojiet globālo paku sarakstam.

npm listnpm list --depth=0 -g

NPM ir labi sevi uzturēt un līdzināšanas atkarības koku lidot, bet tas vienmēr ir labs ieradums, lai dedupe savu projektu pirms publicēšanas. Tas var noņemt dažus paketes jums.

npm dedupe

Tā ir arī lieliska ideja, lai iegūtu labu pārskatu par novecojušām un trūkstošām pakotnēm. Ir grūti nemīlēt šo skatu par labi sakārtotajām kolonnām un Ziemassvētku atmosfēras krāsu shēmu ??

npm outdated

Ja saņemat daudz sarkanu rindu, jums jāpalaiž npm updateatjaunināt paketes uz jaunāko iespējamo versiju atbilstoši jūsu package.json, kas arī ir norādīts vēlamajā slejā

npm update

Lieliski! Tagad, ja jūs npm oudatedatkal palaižat, visām sarkanajām rindām jābūt pazudušām.

Ja izmantojat caret ^priekšā versijām pack.json, galvenās versijas netiks atjauninātas (līdz ar to dzeltenās rindas). Tas ir labi, jo, iespējams, notiek izmaiņas, atjauninot uz jaunu galveno versiju.

Ja jūs joprojām vēlaties visu atjaunināt uz jaunāko versiju, varat izmantot rīku npm-update-all. Tas ir tikpat vienkārši, kā palaist šo komandu projekta mapē.

npx npm-update-all

Forši! Tagad jūs ieguvāt visu savu atkarību jaunāko versiju. Tiek atjaunināts arī jūsu package.json. ⚠️ Esiet informēts par izmaiņu pārtraukšanu ⚠️

7. Dodieties uz mājas lapu, lai iegūtu paku

Vai jāpārbauda paketes dokumentācija? Kāpēc jāpievēršas pārslēgšanās uz pārlūku un jāsāk googlēt, kad viss nepieciešamais ir termināls? ?

Pārlūkprogrammā atveriet pakotnes krātuvi

npm repo

Atveriet mājas lapu

npm home

Atveriet dokumentāciju

npm docs

8. Izmantojiet NPM skriptus

Man patīk npm-skripti! Tā vietā, lai atkārtotu uzdevumu automatizēšanai izmantotu tādus uzdevumu izpildītājus kā Gulp un Grunt, vairumā gadījumu vairāku iemeslu dēļ izmantojiet skriptus npm

➕ Mazāk uzturējamo dev-atkarību vai globālo atkarību.

➕ Nav jaunu rīku, lai mācītos ieguldītājiem un komandas locekļiem

➕ Mazāk koda un konfigurācijas.

Pirmkārt, jums ir iepriekš definēti šādi skripti start, install, test, prepublish, kuriem NPM ir īpaša nozīme. Par to, kā tos var izmantot, varat izlasīt manā iepriekšējā apmācībā, kur mēs izveidojam npm-pack no nulles.

Varat arī izveidot savus pielāgotos skriptus. Šeit ir skripta piemērs, kas formatēs jūsu kodu srcmapē ar ESLint:

package.json:

"scripts":{"test": "jest","format": "eslint src --fix"}

Tagad jūs varat palaist, npm run formatun ESLint darīs savu darbu.

Izmantojot npm skriptus, jūs varat izdarīt daudz ko, piemēram, palaist čaulas komandas un ķēdes pēc otra. Lai iegūtu dziļāku izpratni par šo spēcīgo funkciju, iepazīstieties ar skriptiem npm.

9. NPM skriptu palaišana vsCode

Dažreiz manā paketē ir 30 skripti minūtē. Json (nejoko). ? Par laimi, ja izmantojat Visual Studio kodu, visus savus npm skriptus varat uzskaitīt pārlūkprogrammā un palaist skriptus ar vienas pogas klikšķi! Pārliecinieties, vai šis iestatījums ir iespējots:

npm.enableScriptExplorer: true

10. Iestatiet noklusējuma vērtības

Veidojot jaunu projektu, jūs darbosies, npm initun jums tiks uzdoti jautājumi par jūsu projektu. Lai ietaupītu laiku, jūs, iespējams, rakstīsit palaist, npm init -ylai aizpildītu package.json ar noklusējuma vērtībām.

Bet kādas tieši ir jūsu noklusējuma vērtības? ? Man patīk pašam iestatīt dažus no šiem, lai ietaupītu laiku tālāk! ?

npm konfigurācijas iestatījums init.author.name "Karl-Johan (CJ) Kihl"

npm konfigurācijas iestatījums init.author.email "[email protected]"

Kopsavilkums

Tie bija mani padomi NPM pagaidām! Ja jums ir vairāk padomu un ieteikumu, ar kuriem vēlaties dalīties, lūdzu, pievienojiet komentāru zemāk! ?

? Bonusa saīsne!

Iedomājieties, ka ir piektdienas vakars, un jūs gatavojaties pabeigt jaunu projektu, taču esat pārāk noguris, lai rakstītu npm dedupe. ?

Neuztraucies! Saglabājiet trīs burtus, rakstot:

npm ddp

Paldies par lasīšanu.