Programy ładujące Webpack a wtyczki; co za różnica?


104

Jaka jest różnica między programami ładującymi a wtyczkami w pakiecie internetowym?

Dokumentacja dla wtyczek tylko mówi:

Użyj wtyczek, aby dodać funkcje zwykle związane z pakietami w pakiecie internetowym.

Wiem, że babel używa programu ładującego do transformacji jsx / es2015, ale wygląda na to, że inne typowe zadania (na przykład wtyczka copy-webpack-plugin) używają zamiast tego wtyczek.


2
Loader przekształci pliki do rozpoznawalnego js (i zrobi coś podczas transformacji), wtyczki mogą robić wszystko, czego potrzebują na wyjściu loadera.
David Guan

Odpowiedzi:


62

Programy ładujące wykonują transformację wstępnego przetwarzania praktycznie każdego formatu pliku, gdy używasz czegoś takiego jak require("my-loader!./my-awesome-module")w kodzie. W porównaniu z wtyczkami są one dość proste, ponieważ (a) udostępniają tylko jedną funkcję do pakietu webpack i (b) nie są w stanie wpłynąć na rzeczywisty proces kompilacji.

Z drugiej strony wtyczki mogą głęboko zintegrować się z pakietem internetowym, ponieważ mogą rejestrować punkty zaczepienia w systemie budowania paczek internetowych i uzyskiwać dostęp (i modyfikować) kompilator oraz sposób jego działania, a także kompilację. Dlatego są mocniejsze, ale także trudniejsze w utrzymaniu.


dlaczego program ładujący nie może głęboko zintegrować się z pakietem internetowym?
Nitin.

@NitinTyagi Ponieważ to zadanie wtyczek. Zadaniem Loaderów jest prostota.
helt

154

Dodanie uzupełniającej i prostszej odpowiedzi.

Ładowarki:

Ładowarki działa na poziomie poszczególnych plików podczas lub przed wiązka jest generowana.

Wtyczki:

Wtyczki działają na poziomie pakietu lub fragmentu i zwykle działają pod koniec procesu generowania pakietu. Wtyczki mogą również modyfikować sposób tworzenia samych pakietów. Wtyczki mają większą kontrolę niż programy ładujące.

Na przykład widać wyraźnie na poniższym obrazku, gdzie działają programy ładujące i gdzie działają wtyczki -

wprowadź opis obrazu tutaj Odniesienia: artykuł i obraz


34
Dobra robota! Dwa proste zdania i teraz rozumiem różnicę. Proszę teraz przystąpić do przepisania CAŁEJ biblioteki dokumentów pakietu WWW, ponieważ jest to całkowicie niezrozumiały bełkot.
ryzm

17

Zasadniczo webpack jest tylko pakietem plików. Biorąc pod uwagę bardzo prosty scenariusz (bez dzielenia kodu), może to oznaczać tylko następujące działania (na wysokim poziomie):

  1. znajdź plik wejściowy i załaduj jego zawartość do pamięci
  2. dopasuj określony tekst w treści i oceń go (np. @import)
  3. znajdź zależności na podstawie wcześniejszej oceny i zrób z nimi to samo
  4. zszyć je wszystkie w paczkę w pamięci
  5. zapisz wyniki do systemu plików

Dokładne zbadanie powyższych kroków odzwierciedla to, co robi kompilator Java (lub dowolny kompilator). Oczywiście istnieją różnice, ale nie mają one znaczenia dla zrozumienia programów ładujących i wtyczek.


Ładowarki:

są tutaj, ponieważ pakiet webpack obiecuje zebrać razem dowolny typ pliku.

Ponieważ pakiet webpack w swej istocie jest w stanie tylko spakować pliki js, ta obietnica oznaczała, że ​​zespół rdzenia webpacka musiał uwzględnić przepływy kompilacji, które pozwoliły zewnętrznemu kodowi na przekształcenie określonego typu pliku w sposób, który może wykorzystać pakiet internetowy.

Te zewnętrzne kody są nazywane programami ładującymi i zazwyczaj są uruchamiane w kroku 1 i 3 powyżej. Tak więc, ponieważ etap, na którym te programy ładujące muszą działać, jest oczywisty, nie wymagają one haków ani nie wpływają na proces kompilacji (ponieważ kompilacja lub pakiet ma miejsce tylko w kroku 4).

Tak więc programy ładujące przygotowują scenę do kompilacji iw pewnym sensie zwiększają elastyczność kompilatora webpacka.


Wtyczki:

są tutaj, ponieważ chociaż webpack nie obiecuje bezpośrednio zmiennych danych wyjściowych, świat tego chce, a webpack na to pozwala.

Ponieważ pakiet webpack w swej istocie jest tylko pakietem, a mimo to przechodzi przez kilka kroków i podetapów, kroki te można wykorzystać do zbudowania dodatkowej funkcjonalności.

Proces budowania produkcji (minifikacja i zapis do systemu plików), który jest natywną zdolnością kompilatora webpack, na przykład, może być traktowany jako rozszerzenie jego podstawowych możliwości (czyli po prostu bundlingu) i może być traktowany jak natywna wtyczka. Gdyby tego nie zrobili, zrobiłby to ktoś inny.

Patrząc na natywną wtyczkę powyżej, wygląda na to, że pakietowanie lub kompilację pakietu internetowego można podzielić na podstawowy proces tworzenia pakietów, a także wiele natywnych procesów wtyczek, które możemy wyłączyć, dostosować lub rozszerzyć. Oznaczało to zezwolenie zewnętrznemu kodowi na dołączenie do procesu tworzenia pakietów w określonych punktach, z których mogą wybierać (zwanymi punktami zaczepienia).

Wtyczki zatem wpływają na wyjście i w pewnym sensie rozszerzają możliwości kompilatora webpack.


1
Świetna odpowiedź, naprawdę maluje żywy obraz
Robotron

Bardzo podoba mi się ta odpowiedź. Daje ci pewne wyjaśnienie, aby móc rozumować. Nie tylko definicja, ale także jej wgląd.
Dazag

1

Programy ładujące działają na poziomie plików . Mogą napisać szablon, przetworzyć kod, aby przetransponować go w zależności od Twojej wygody itp.

Wtyczki działają na poziomie systemu . Mogą pracować na wzorcu, obsłudze systemu plików (nazwa, ścieżka) itp.

Korzystając z naszej strony potwierdzasz, że przeczytałeś(-aś) i rozumiesz nasze zasady używania plików cookie i zasady ochrony prywatności.
Licensed under cc by-sa 3.0 with attribution required.