JavaScript >> Javascript-Tutorial >  >> Tags >> npm

Das npm-Abhängigkeitshandbuch für Sie

Einführung

Node Package Manager (npm) ist das Online-Software-Repository, das bei der Veröffentlichung und Verwaltung von node.js-basierten Open-Source-Projekten hilft. Es bietet auch eine CLI (Befehlszeilenschnittstelle) für die Paketinstallation/-deinstallation, die Versionsverwaltung und die Abhängigkeitsverwaltung.

Alle npm-Pakete enthalten eine bestimmte Datei namens package.json . Diese Datei besteht aus mehreren Metadaten, die für ein Paket erforderlich sind. Es ist die Datei, in der ein Paketbesitzer den Namen, die Version, Abhängigkeiten, Lizenzinformationen, das Code-Repository usw. des Pakets beschreibt. Diese Datei stellt npm Informationen bereit, damit das npm-Repository das Paket eindeutig identifizieren und die Abhängigkeiten verwalten kann.

In diesem Artikel erkläre ich die verschiedenen Arten der Verwaltung von Abhängigkeiten und wie sie sich voneinander unterscheiden.

Aber Moment mal, was ist Abhängigkeit?

In der Welt der Wiederverwendbarkeit und einer Open-Source-Denkweise werden wir selten eine App ohne Abhängigkeiten erstellen.

📦 Abhängigkeiten

dependencies werden als einfaches JSON-Objekt in der Datei „package.json“ angegeben. Jede Abhängigkeit ist ein Schlüssel-Wert-Paar, wobei der Schlüssel der Name der Abhängigkeit ist und der Wert eine Zeichenfolge sein kann, die entweder

angibt
  • Die Paketversion
  • Eine Git-URL
  • Eine Tarball-Datei-URL

Sie sollten nur die unbedingt benötigten Pakete angeben, damit die App in den Abhängigkeiten ausgeführt werden kann Objekt. Es sollte keine Pakete enthalten, die hauptsächlich zum Erstellen, Transpilieren und Testen verwendet werden.

Hier ist ein Beispiel für Abhängigkeiten, die mit den jeweiligen Paketversionen deklariert wurden,

"dependencies": {
    "moment": "^2.24.0",
    "react": "^16.9.0",
    "react-dom": "^16.9.0",
    "react-redux": "^7.2.0",
    "react-router-dom": "^5.1.2",
    "recharts": "^1.8.5",
    "redux": "^4.0.5",
    "redux-thunk": "^2.3.0"
  }

Wenn Sie eine Git-URL für die Paketinstallation angeben möchten, können Sie dies im folgenden Format tun:

<protocol>://[<user>[:<password>]@]<hostname>[:<port>][:][/]<path>[#<commit-ish> | #semver:<semver>]

Und dann als Abhängigkeit mit username/repo#branch-name einbinden formatieren.

Hier ist ein Beispiel,

"dependencies": {
  "cli": "atapas/horoscope-cli#multi-langs"
 }

Möglicherweise möchten Sie ein Paket lokal erstellen und testen, ohne es zu veröffentlichen. npm stellt den Dienstprogrammbefehl namens npm pack bereit um einen Tarball für ein Paket zu erstellen. Sie können diesen Tarball-Speicherort als URL verwenden, um ihn als Abhängigkeitswert in einem anderen Projekt anzugeben.

"dependencies": {
   "react-timeline": "file:react-timeline-0.0.2.tgz"
 }

Beachten Sie, dass der Wert den Dateinamen des Tarballs zusammen mit dem file: enthält Kennung als Präfix.

📦 devdependencies

Wenn Sie ein Paket entwickeln, möchten Sie möglicherweise nicht, dass die Verbraucher (Benutzer) des Pakets die mit Test, Transpile, Build und Dokumentation zusammenhängenden Abhängigkeiten herunterladen. Diese sind intern in Ihrem Paket und Verbraucher benötigen sie nicht. Beispiel:jasmine ist eine Testabhängigkeit und babel ist eine Abhängigkeit zum Transpilieren von erweitertem EcmaScript-Code in ES5 für Abwärtskompatibilität.

devDependencies ist ein weiteres Meta-Tag in der Datei „package.json“, das bei der Unterscheidung zwischen Entwicklungszeit und Laufzeit hilft Abhängigkeiten. Das Deklarieren von Abhängigkeiten als devDependencies hilft im Folgenden,

  • Unterscheiden Sie die Pakete (oder Bibliotheken), die Sie als unbedingte Abhängigkeit bündeln möchten, und das, was Sie für Ihre Entwicklung, Tests und Erstellung benötigen.
  • Wenn Ihre Organisation die Praxis verfolgt, die Lizenz verwendeter Pakete zu registrieren, tun Sie dies nur für dependencies , nicht für devDependencies .
  • Vermeiden Sie das Herunterladen unnötiger Pakete. Was auch immer in devDependencies deklariert ist, wird nicht heruntergeladen, wenn Sie einen --production angeben mit npm install kennzeichnen Befehl.

Beispiel für devDependencies -Deklaration in der Datei package.json.

"devDependencies": {
    "@babel/cli": "7.10.1",
    "@babel/core": "7.8.7",
    "@babel/plugin-proposal-class-properties": "7.8.3",
    "@babel/preset-react": "7.10.1",
    "babel-preset-es2015": "6.24.1",
    "jasmine": "2.0.0"
  }

📦 peerDependencies

Nehmen wir an, Sie entwickeln eine React-Komponente und möchten diese als npm-Paket zur Verfügung stellen. Sie wollen eine Kompatibilitätsprüfung für react und react-dom Paketversionen zwischen Ihrem Paket und der Verbraucher-App.

Wie machst du das? Wie stellen Sie sicher, dass die Kompatibilität von React- und React-Dom-Versionen beispielsweise 16.12.0 ist?

Dann brauchen Sie peerDependencies . Sie können die peerDependencies als weitere Metainformationen in der Datei „package.json“ wie folgt deklarieren:

"peerDependencies": {
    "react": "16.12.0",
    "react-dom": "16.12.0"
  },

Bei Inkompatibilitäten wird eine Warnung ausgegeben, dass peerDependency es ist nicht installiert. Diese Warnung ist eine großartige Möglichkeit, die Entwickler davor zu bewahren, in eine Situation namens Abhängigkeitshölle zu geraten.

📦bundleddependencies

Es hilft bei der Bündelung eines oder mehrerer Pakete innerhalb Ihres Pakets. bundledDependencies hilft beim Definieren einer Reihe von Paketen, die Sie direkt beim Erstellen Ihres Pakets bündeln möchten.

Hier ist ein Beispiel, in dem Ihr Paket my-great-package bündelt zwei weitere Pakete, your-package und her-package .

{
  "name": "my-great-package",
  "version": "1.0.0",
  "bundledDependencies": [
    "your-package", "her-package"
  ]
}

Sie können es hauptsächlich für diese Zwecke verwenden:

  • Sie haben ein privates npm-Paket, das nicht in der npm-Registrierung verfügbar ist, und Sie möchten es mit einem anderen Paket bündeln.
  • Sie möchten einige Dateien (Dokumente) zusammen mit Ihrem Paket bündeln und verteilen.

📦 optionale Abhängigkeiten

Wie der Name schon sagt, ist es für optionale Abhängigkeiten. Wenn diese Abhängigkeiten nicht installiert werden können, wird npm oder Garn trotzdem sagen, dass der Installationsvorgang erfolgreich war.

Es kann Abhängigkeiten geben, die nicht unbedingt in jeder Umgebung funktionieren, und Sie möchten einen Fallback-Mechanismus, wenn sie nicht installiert sind. So können Sie optionalDependencies definieren in der Datei package.json.

"optionalDependencies": {
    "package-X": "^5.1.0"
  }

Schlussfolgerung

Abschließend möchte ich erwähnen, dass Sie möglicherweise nicht alle Methoden des Abhängigkeitsmanagements verwenden, die wir hier gesehen haben, aber Sie müssen sie kennen. Wenn Sie die Abhängigkeitsverwaltungsmechanismen kennen, können Sie Ihre Projektabhängigkeiten sehr gut organisieren.

Ich habe ein paar Fehler gesehen, die von den Entwicklern gemacht wurden, wie

  • Mischen von dependencies und devDependencies zusammen. Dies kann zu Problemen wie dem Herunterladen unnötiger Dateien führen.
  • Im Produktions-Build-Modus, ohne sich auf --production zu verlassen Flagge.

Ich hoffe, dieser Artikel gibt Ihnen ein grundlegendes Verständnis für mehrere Möglichkeiten des Abhängigkeitsmanagements, die mit dem npm-Ökosystem verfügbar sind. Näheres entnehmen Sie bitte diesem.

Das Titelbild ist eine Improvisation, die auf einem Design von Freepik erstellt wurde.

Wenn es für Sie hilfreich war, liken/teilen Sie es bitte, damit es auch andere erreicht. Um E-Mail-Benachrichtigungen zu meinen neuesten Beiträgen zu erhalten, abonnieren Sie sich bitte zu meinem Blog, indem Sie oben auf der Seite auf die Schaltfläche "Abonnieren" klicken.