Vertieftes Verständnis des NPM-Mechanismus
Dieser Artikel vermittelt Ihnen ein tiefgreifendes Verständnis des NPM-Mechanismus. Ich hoffe, dass er für Freunde in Not hilfreich ist.
Bei der Installation mit NPM treten häufig Paketkonflikte auf (z. B. inkonsistente Versionen von Untermodulen mehrerer Hauptmodule usw.), die während des Entwicklungsprozesses zu verschiedenen größeren oder kleineren Problemen führen. Alle folgenden Inhalte werden hier vorgestellt:
- NPM-Hauptinstallationsmethode
- NPM-Paketinformationsabfrage
- NPM-Installationsmechanismus (Haupt)
Installations- und Abfragebefehle
Verschiedene NPM-Installationsmethoden
-
npm install packageName[@next | @versionNumber]
- in node_modules Installieren Wenn kein Modul angegeben ist (überprüfen Sie nicht das Verzeichnis ~/.npm)
-
npm install packageName --f | -- force
- Ein Modul spielt keine Rolle ob es installiert wurde oder nicht, npm Alle sind erforderlich Neuinstallation erzwingen
-
npm update packageName
- Wenn die Remote-Version ist neuer oder die lokale Version existiert nicht. Installieren Sie
NPM-Abfragedienst
- NPM verwendet den Registrierungsabfragedienst, um Sie kennen die neueste Version jedes Moduls.
- Sie können die Informationen des Zuordnungsmoduls über
npm view packageName [version]
NPM-Installationsmechanismus abfragen
Nachdem Sie den Befehl npm install eingegeben und die Eingabetaste gedrückt haben, können Sie loslegen durch die folgenden Schritte (am Beispiel von npm 5.5.1):
1. Führen Sie die Vorinstallation des Projekts selbst aus
Wenn der Vorinstallations-Hook definiert ist Das aktuelle NPM-Projekt wird zu diesem Zeitpunkt ausgeführt.
2. Bestimmen Sie das Abhängigkeitsmodul der ersten Ebene
Das erste, was Sie tun müssen, ist, die Abhängigkeit der ersten Ebene im Projekt zu bestimmen, also direkt in den Attributen dependencies
und devDependencies
Das angegebene Modul (vorausgesetzt, zu diesem Zeitpunkt werden keine npm-Installationsparameter hinzugefügt).
Das Projekt selbst ist der Wurzelknoten des gesamten Abhängigkeitsbaums. Jedes Abhängigkeitsmodul der ersten Ebene ist ein Unterbaum unter dem Wurzelknoten. npm startet mehrere Prozesse von jeder Abhängigkeit der ersten Ebene Das Modul beginnt nach und nach nach tieferen Knoten zu suchen.
Wenn das angegebene Modul bereits im Verzeichnis „node_modules“ der Abfrage vorhanden ist, wird es nicht neu installiert
3. Holen Sie sich das Modul.
Das Modul wird abgerufen a Der rekursive Prozess ist in die folgenden Schritte unterteilt:
-
Modulinformationen abrufen
- Bevor Sie ein Modul herunterladen, müssen Sie es zunächst bestimmen seine Version. Dies liegt daran, dass package.json häufig eine semantische Version (semver, semantische Version) enthält.
- Zu diesem Zeitpunkt sind die Modulinformationen in der Versionsbeschreibungsdatei (npm-shrinkwrap.json oder package-lock .json), direkt abrufen. Einfach
- Wenn nicht, holen Sie es sich aus dem Lager (Abfrage bei der Registry). Beispielsweise lautet die Version eines Pakets in packaeg.json ^1.1.0. npm geht zum Warehouse, um die neueste Version abzurufen, die dem 1.x.x-Format entspricht.
-
Modulentität abrufen.
- Im vorherigen Schritt wird die komprimierte Paketadresse des Moduls abgerufen (das aufgelöste Feld verwendet diese Adresse, um den lokalen Cache zu überprüfen). Wenn nicht, wird es aus dem Lager heruntergeladen.
-
Suchen Sie nach Abhängigkeiten dieses Moduls
- Wenn es Abhängigkeiten gibt, gehen Sie zurück zu Schritt 1, wenn nicht, stoppen Sie.
4. Modulabflachung (Deduplizierung)
Was in einem Schritt erhalten wird, ist ein vollständiger Abhängigkeitsbaum, der Lots enthalten kann von sich wiederholenden Modulen. Beispielsweise hängt Modul A von Loadsh ab und Modul B hängt auch von Lodash ab. Vor npm3 basierte die Installation streng auf der Struktur des Abhängigkeitsbaums, was zu Modulredundanz führte.
Ein Deduplizierungsprozess wird standardmäßig ab npm3 版本
hinzugefügt. Es durchläuft alle Knoten und platziert die Module einzeln unter dem Wurzelknoten, der die erste Ebene der Knotenmodule darstellt. Wenn doppelte Module gefunden werden, werden diese verworfen.
Hier müssen Sie ein doppeltes Modul definieren, das darauf verweist, dass der Modulname derselbe ist und Semver kompatibel ist. Jedes Segment entspricht einem zulässigen Versionsbereich. Wenn sich die zulässigen Versionsbereiche zweier Module überschneiden, kann eine kompatible Version erhalten werden, ohne dass genau dieselbe Versionsnummer erforderlich ist. Dies ermöglicht das Entfernen weiterer redundanter Module.
Zum Beispiel
- unter node-modules hängt das foo-Modul von lodash@^1.0.0 ab, und das bar-Modul hängt von lodash@^1.1.0 ab, dann ^ 1.1.0 ist die kompatible Version.
- Wenn foo von lodash@^2.0.0 und bar von lodash@^1.1.0 abhängt, gibt es gemäß den Regeln von Semver keine kompatible Version zwischen ihnen. Eine Version wird in „node_modules“ abgelegt und die andere verbleibt im Abhängigkeitsbaum.
Angenommen, ein Abhängigkeitsbaum sah ursprünglich so aus:
node_modules
-- foo
---- lodash@version1
-- bar
---- lodash@version2
Angenommen, dass Version1 und Version2 kompatible Versionen sind, wird es nach der Deduplizierung die folgende Form annehmen:
node_modules
-- foo
-- bar
-- lodash (die beibehaltene Version ist die kompatible Version)
Unter der Annahme, dass Version1 und Version2 inkompatible Versionen sind, werden die späteren Versionen in der Abhängigkeit beibehalten Baum:
node_modules
-- foo
-- lodash@version1
-- bar
---- lodash@version2
5. Modul installieren
Dieser Schritt aktualisiert node_modules im Projekt und führt die Lebenszyklusfunktionen im Modul aus (in der Reihenfolge Vorinstallation, Installation, Nachinstallation).
6. Führen Sie den eigenen Lebenszyklus des Projekts aus
Wenn für das aktuelle npm-Projekt ein Hook definiert ist, wird er zu diesem Zeitpunkt ausgeführt (in der Reihenfolge von Installation, Nachinstallation, Vorveröffentlichung und Vorbereitung).
Der letzte Schritt besteht darin, die Versionsbeschreibungsdatei zu generieren oder zu aktualisieren, und der npm-Installationsprozess ist abgeschlossen.
Dieser Artikel ist hier zu Ende. Weitere spannende Inhalte finden Sie in der Spalte JavaScript-Video-Tutorial auf der chinesischen PHP-Website!
Das obige ist der detaillierte Inhalt vonVertieftes Verständnis des NPM-Mechanismus. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Heiße KI -Werkzeuge

Undresser.AI Undress
KI-gestützte App zum Erstellen realistischer Aktfotos

AI Clothes Remover
Online-KI-Tool zum Entfernen von Kleidung aus Fotos.

Undress AI Tool
Ausziehbilder kostenlos

Clothoff.io
KI-Kleiderentferner

Video Face Swap
Tauschen Sie Gesichter in jedem Video mühelos mit unserem völlig kostenlosen KI-Gesichtstausch-Tool aus!

Heißer Artikel

Heiße Werkzeuge

Notepad++7.3.1
Einfach zu bedienender und kostenloser Code-Editor

SublimeText3 chinesische Version
Chinesische Version, sehr einfach zu bedienen

Senden Sie Studio 13.0.1
Leistungsstarke integrierte PHP-Entwicklungsumgebung

Dreamweaver CS6
Visuelle Webentwicklungstools

SublimeText3 Mac-Version
Codebearbeitungssoftware auf Gottesniveau (SublimeText3)

Heiße Themen

Die Verwendung von Bootstrap in Vue.js ist in fünf Schritte unterteilt: Startstrap installieren. Bootstrap in main.js. Verwenden Sie die Bootstrap -Komponente direkt in der Vorlage. Optional: benutzerdefinierter Stil. Optional: Verwenden Sie Plug-Ins.

HTML definiert die Webstruktur, CSS ist für Stil und Layout verantwortlich, und JavaScript ergibt eine dynamische Interaktion. Die drei erfüllen ihre Aufgaben in der Webentwicklung und erstellen gemeinsam eine farbenfrohe Website.

React kombiniert JSX und HTML, um die Benutzererfahrung zu verbessern. 1) JSX bettet HTML ein, um die Entwicklung intuitiver zu gestalten. 2) Der virtuelle DOM -Mechanismus optimiert die Leistung und reduziert den DOM -Betrieb. 3) Komponentenbasierte Verwaltungs-Benutzeroberfläche zur Verbesserung der Wartbarkeit. 4) Staatsmanagement und Ereignisverarbeitung verbessern die Interaktivität.

WebdevelopmentRelieSonHtml, CSS und JavaScript: 1) HtmlStructuresContent, 2) CSSstylesit und 3) JavaScriptaddssinteraktivität, Bildung von TheBasisofModerernwebexperiences.

Es gibt zwei Möglichkeiten, eine Bootstrap -Split -Zeile zu erstellen: Verwenden des Tags, das eine horizontale Split -Linie erstellt. Verwenden Sie die CSS -Border -Eigenschaft, um benutzerdefinierte Style Split -Linien zu erstellen.

Es gibt verschiedene Möglichkeiten, Bilder in Bootstrap einzufügen: Bilder direkt mit dem HTML -IMG -Tag einfügen. Mit der Bootstrap -Bildkomponente können Sie reaktionsschnelle Bilder und weitere Stile bereitstellen. Legen Sie die Bildgröße fest und verwenden Sie die IMG-Fluid-Klasse, um das Bild anpassungsfähig zu machen. Stellen Sie den Rand mit der img-beliebten Klasse ein. Stellen Sie die abgerundeten Ecken ein und verwenden Sie die IMG-Rund-Klasse. Setzen Sie den Schatten, verwenden Sie die Schattenklasse. Größen Sie die Größe und positionieren Sie das Bild im CSS -Stil. Verwenden Sie mit dem Hintergrundbild die CSS-Eigenschaft im Hintergrund.

H5REFERSTOHTML5, ApivotaltechnologyInwebdevelopment.1) HTML5IntroducesNewelementsandapisrich, Dynamicwebapplications.2) ITSUPP ortsmultimediaWitHoutPlugins, BETHINGINGUSEREXPERICERCROSSDEVICES.3) SEMANTICELEMENTSIMPROVEPENTENTENTENTRUCTENTRUCTELUREANDSEO.4) H5'SRespo

Wie benutze ich die Bootstrap -Taste? Führen Sie Bootstrap -CSS ein, um Schaltflächenelemente zu erstellen, und fügen Sie die Schaltfläche "Bootstrap" hinzu, um Schaltflächentext hinzuzufügen
