Miután majdnem 8 évig használtam az NPM-et, megtanultam olyan dolgokat, amelyeket bárcsak tudtam volna, amikor elkezdtem. Nevezzük őket trükköknek, olyan dolgoknak, amelyek drasztikusan javították az NPM-mel való munkám módját. Ma szeretném megosztani veletek a legjobb 10 trükkömet.
1. Időt takaríthat meg. ⏲ Használja a Parancsikonokat
Ez az egyik leghasznosabb, de nem annyira dokumentált szolgáltatás. Lehet, hogy egy parancs parancsikonja triviális dolognak tűnik, de az az igazság, hogy 30–60% -kal kevesebb kódot fog írni . Időt takarít meg, amit eltölthet valami értelmes dologra, például egy extra csésze kávé meginni ☕️?
Ahelyett npm install
írj .npm i
Ahelyett npm install--save
írj .npm i -S
Ahelyett npm install--save-dev
írj .npm i -D
Ahelyett npm install--global
írj .npm i -G
? Bónusz parancsikon! Lenyűgözni szeretné kollégáit? ? Itt jön…
Ahelyett npm test
írj .npm t
2. Telepítsen több csomagot egy parancsba
Miért írjon több sort, ha megírhat egyet? ? Ha fejből ismeri a csomagjait, akkor a leggyorsabb megoldás az, ha mindet egy vonalba telepíti, de legyen óvatos! Egy hibásan írt csomag és az egész parancs meghiúsul. Ha nem biztos a nevekben, telepítse őket egyenként.
npm i -S react redux react-redux 3. Telepítse a csomagokat különböző forrásokból
Alapértelmezés szerint futáskor az npm-installNPM telepíti az npm- register (//registry.npmjs.org) legújabb verzióját
De van még! Az NPM más forrásokból is telepíthet csomagokat, például URL-ből vagy egy tarball fájlból.
Ha saját csomagokat készít, vagy a meglévő csomagok lekérését kéri, akkor ez a funkció hatékony. Például, ha rendelkezik saját Redux-villával, telepítheti a csomagot közvetlenül a villájáról. (Váltás usernamea felhasználónevére a GitHubon.)
npm i Még jobb, ha GitHub-adattárat használ, akkor ezt a parancsikont használhatja:
npm i username/redux
Van még! Csomagot is telepíthet egy adott fiókból. Hasznos egy jövőbeli kiadás tesztelése közben. Csak add hozzá #az ág nevéhez a végén.
npm i username/redux#? Bónusz parancsikon! Nem a GitHub-ot használja? Semmi gond, vannak parancsikonok a BitBucket és a GitLab számára is:
npm i bitbucket:username/myrepositorynpm i gitlab:username/myrepository4. Csomagok összekapcsolása
Néha egyszerre szeretne dolgozni egy projekten és fejleszteni a csomagjait. Fárasztó elkötelezni és elküldeni a csomagot egy távoli adattárnak minden változtatáshoz, amelyet ki akar próbálni. ? Ehelyett használhatja a csomag-összekapcsolás nevű szolgáltatást .
A csomagok összekapcsolása úgy működik, hogy létrehoz egy symlinket a node_modules mappában, amely a csomag helyi tárházára mutat. Ily módon helyileg szerkesztheti a csomagokat, és a módosítások azonnal elérhetők lesznek a projektben, annak használatával.
A csomagkapcsolás megértésének legegyszerűbb módja az, ha kipróbálja!
Tegyük fel, hogy van egy projektünk myprojectés egy csomagunk mypackage. mypackageFüggősége akarunk lenni myproject.
Menj a mappába, mypackageés írj
npm linkSzép! Most menjen a mappába, myprojectés írjon
npm link mypackage
Kész! Nézze meg közelebbről a mappa felépítését
Amint láthatja, myproject/node_modules/mypackagemost szimbólum link a mappához mypackage! Mostantól folytathatja a fejlesztést, mypackageés minden elvégzett változtatása azonnal elérhető lesz myproject.
5. Az npx parancs
Az NPM-en sok olyan szkripteszköz található, amelyeket valószínűleg használni fog, de nem lesz része a futásidejű csomagnak. A morgás, a falatozás, a reakció-létrehozás-alkalmazás, a reakció-bennszülött-klí és a mokka csak néhány.
Az NPM 5.x előtt ezeket az eszközöket globális csomagként vagy devDependencies-ként kellett telepítenie. Ez időigényes volt, nemcsak a telepítéshez, hanem az összes eszköz fenntartásához több projekthez. Ezenkívül a legtöbb eszköz csak egyszer vagy kétszer használható.
Itt a bináris NPX megment és rengeteg munkát megspórol nekünk! Például egy új reakció-projekt elindításához egyszerűen írja:
npx create-react-app my-new-project
A create-reagál-alkalmazás legújabb verzióját azonnal letöltjük és végrehajtjuk. Nincs több eszköz telepítése és karbantartása globális csomagként.
6. Figyelje és tisztítsa meg a projektet
Fontos megérteni, mi történik a motorháztető alatt a csomagok telepítésekor, a problémák megoldása érdekében, és hogy a függőségi fa és a csomag végleges mérete a lehető legkisebb legyen.
Először is, jó áttekintésre van szükségünk a függőségi fáról és arról, hogy mely csomagcsomagokat telepítették valójában. Használja a parancsot npm list. Add a zászlót --depth=0a lista csak a felső szintű csomagokat, és adjunk hozzá -ga listához a globális csomagokat.
npm listnpm list --depth=0 -g
Az NPM jól képes fenntartani önmagát és a függőségi fát menet közben ellaposítani, de mindig jó szokás a projekt elkötelezettsége a közzététel előtt. Lehet, hogy eltávolít néhány csomagot az Ön számára.
npm dedupe
Nagyszerű ötlet jó áttekintést kapni az elavult és hiányzó csomagokról. Nehéz nem szeretni ezt a nézetet a jól szervezett oszlopok és a karácsonyi hangulatú színvilág miatt ??
npm outdated
Ha sok piros sort kap, futtatnia kell, npm updatehogy frissítse a csomagokat a legújabb lehetséges verzióra a package.json szerint, ami a kívánt oszlopban is szerepel.
npm update
Nagy! Most, ha npm oudatedújra elindul , az összes piros sornak el kell tűnnie.
Ha a caret- ^et a package.json verziók előtt használja , a főbb verziók nem frissülnek (ezért a sárga sorok). Ez jó, mert törésszerű változások történhetnek, ha új fő verzióra frissülnek.
Ha továbbra is mindent szeretne frissíteni a legújabb verzióra, használhatja az eszközt npm-update-all. Olyan egyszerű, mint futtatni ezt a parancsot a projekt mappájában.
npx npm-update-all
Menő! Most megkapta az összes függőségének legújabb verzióját. A package.json is frissül. ⚠️ Legyen tisztában a megtörő változásokkal ⚠️
7. Menjen a honlapra egy csomagért
Meg kell vizsgálnia a csomag dokumentációját? Miért bajlódna a böngészőre való áttérés és a guglizás, amikor minden szükséges a terminál? ?
Nyissa meg a csomag tárházát a böngészőben
npm repo
Nyissa meg a kezdőlapot
npm home
Nyissa meg a dokumentációt
npm docs
8. Használjon NPM szkripteket
Szeretem az npm-szkripteket! Ahelyett, hogy az ismétlődő feladatok automatizálásához olyan feladat-futókat használna, mint a Gulp és a Grunt, a legtöbb esetben több okból is használhat npm-szkripteket:
➕ Kevesebb fenntartandó dev-függőség vagy globális függőség van.
➕ Nincsenek új eszközök a közreműködők és a csapattagok számára a tanuláshoz
➕ Kevesebb kód és konfiguráció.
Először is, előre definiált szkriptjeinek start, install, test, prepublishkülönleges jelentése van az NPM-ben. A felhasználásukról az előző oktatóanyagomban olvashat, ahol egy nulláról készítünk egy npm-csomagot.
Saját egyéni szkripteket is létrehozhat. Íme egy példa egy szkriptre, amely formázza a kódot a srcmappában az ESLint segítségével:
package.json:
"scripts":{"test": "jest","format": "eslint src --fix"}Most már futhat, npm run formatés az ESLint elvégzi a dolgát.
Az npm-szkriptekkel nagyon sok mindent megtehet, például futtathat shell-parancsokat és szkripteket egymás után láncolhat. Nézze meg az npm-szkripteket, hogy jobban megismerje ezt a hatékony szolgáltatást.
9. NPM parancsfájlok futtatása vsCode-ban
Néha 30 npm szkript van a csomagomban. Json (Nem viccelek). ? Szerencsére, ha Visual Studio Code-ot használ, az összes npm-szkriptjét felsorolhatja az explorerben, és egy kattintással futtathatja a szkripteket! Győződjön meg róla, hogy ez a beállítás engedélyezve van:
npm.enableScriptExplorer: true
10. Állítsa be az alapértelmezett értékeket
Új projekt létrehozásakor futni fog, npm inités kérdéseket fognak feltenni a projektjével kapcsolatban. Időmegtakarítás érdekében valószínűleg írjon futni, npm init -yhogy kitöltse az alapértelmezett értékekkel a package.json fájlt.
De pontosan mik az alapértelmezett értékei? ? Szeretnék ezek közül néhányat beállítani, hogy időt spóroljak tovább! ?
npm config set init.author.name "Carl-Johan (CJ) Kihl"
npm konfigurációs készlet init.author.email "[email protected]"
Összegzés
Egyelőre ezek voltak a tippjeim az NPM-hez! Ha további tippeket és trükköket szeretne megosztani, kérjük, írjon megjegyzést alább! ?
? Bónusz parancsikon!
Képzelje el, hogy péntek este van, és hamarosan befejezi az új projektet, de túl fáradt vagy ahhoz, hogy írj npm dedupe. ?
Semmi gond! Három betűt írással menthet:
npm ddp
Köszönöm, hogy elolvasta.