Was ist das Verpackungsprinzip von Webpack?

Das Prinzip der Webpack-Verpackung besteht darin, die Abhängigkeiten zwischen Dateien statisch zu analysieren und dann gemäß den angegebenen Regeln statische Ressourcen aus diesen Modulen zu generieren. Wenn Webpack das Programm verarbeitet, erstellt es rekursiv ein Abhängigkeitsdiagramm, das die von der Anwendung benötigten Module enthält Packen Sie dann alle diese Module in ein Bundle.

wird basierend auf den Abhängigkeiten zwischen Dateien statisch analysiert, und dann generieren diese Module statische Ressourcen gemäß den angegebenen Regeln. Wenn das Webpack das Programm verarbeitet, wird ein Abhängigkeitsdiagramm rekursiv erstellt, in dem jedes Modul enthalten ist Anwendungsanforderungen und packt dann alle diese Module in ein oder mehrere Bundles.

Webpack ist lediglich ein Mechanismus zum Packen von Modulen. Es konvertiert lediglich abhängige Module in statische Dateien, die diese Pakete darstellen können. Es handelt sich nicht um eine modulare Spezifikation wie commonjs oder amd. Webpack identifiziert Ihre Eintragsdatei. Identifizieren Sie Ihre Modulabhängigkeiten, um Ihren Code zu verpacken.

Die Frage, ob Ihr Code den CommonJS-, AMD- oder ES6-Import verwendet. Webpack wird es analysieren. um die Abhängigkeiten des Codes zu erhalten.

Webpack analysiert den Code. Code konvertieren, Code kompilieren, Code ausgeben. Webpack selbst ist ein Modul von node, daher wird webpack.config.js in der Form von commonjs geschrieben (die Modularisierung im Knoten wird durch commonjs standardisiert)

Jedes Modul im Webpack hat eine eindeutige ID, die von 0 ansteigt. Das gesamte Paket bundle.js ist eine anonyme Funktion, die sich selbst ausführt. Der Parameter ist ein Array. Jedes Element im Array ist eine Funktion. Der Inhalt der Funktion ist der Inhalt jedes Moduls und ist in der Reihenfolge der Anforderungen angeordnet.

Erweiterte Informationen:

Webpack-Kernkonzepte:

1. Eintrag

Der Einstiegspunkt gibt an, welches Modul Webpack als Anfang für die Erstellung seines internen Abhängigkeitsdiagramms verwenden soll. Nach Eingabe des Einstiegspunkts findet Webpack heraus, von welchen Modulen und Bibliotheken der Einstiegspunkt abhängt (direkt und indirekt). Jede Abhängigkeit wird dann verarbeitet und in Dateien namens Bundles ausgegeben.

2. Ausgabe

Das Ausgabeattribut teilt Webpack mit, wo die von ihm erstellten Bundles ausgegeben werden sollen und wie diese Dateien benannt werden sollen. Grundsätzlich wird die gesamte Anwendungsstruktur in den Ordner des angegebenen Ausgabepfads kompiliert.

3. Modul

Modul, alles in Webpack ist ein Modul und ein Modul entspricht einer Datei. Webpack findet rekursiv alle abhängigen Module, beginnend mit dem konfigurierten Eintrag.

4. Chunk

Codeblock besteht aus mehreren Modulen und wird zum Zusammenführen und Aufteilen von Code verwendet.

5. Loader

Loader ermöglicht dem Webpack die Verarbeitung von Nicht-JavaScript-Dateien (das Webpack selbst versteht nur JavaScript).

loader kann alle Arten von Dateien in gültige Module konvertieren, die Webpack verarbeiten kann, und Sie können sie dann mit den Verpackungsfunktionen von Webpack verarbeiten.

Im Wesentlichen konvertiert der Webpack-Loader alle Arten von Dateien in Module, auf die direkt vom Abhängigkeitsdiagramm der Anwendung (und letztendlich vom Bundle) verwiesen werden kann.

Das obige ist der detaillierte Inhalt vonWas ist das Verpackungsprinzip von Webpack?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!