Trình tải webpack so với plugin; có gì khác biệt?

Sự khác biệt giữa trình tải và plugin trong webpack là gì?

Các tài liệu hướng dẫn cho các plugins chỉ nói:

Sử dụng các plugin để thêm chức năng thường liên quan đến các gói trong webpack.

Tôi biết rằng babel sử dụng trình tải cho các chuyển đổi jsx / es2015, nhưng có vẻ như các tác vụ thông thường khác (ví dụ: copy-webpack-plugin) sử dụng plugin thay thế.

Trình tải thực hiện chuyển đổi tiền xử lý của hầu như bất kỳ định dạng tệp nào khi bạn sử dụng sth như require("my-loader!./my-awesome-module")trong mã của mình. So với các plugin, chúng khá đơn giản vì chúng (a) chỉ hiển thị một chức năng duy nhất cho webpack và (b) không có khả năng ảnh hưởng đến quá trình xây dựng thực tế.

Mặt khác, các plugin có thể tích hợp sâu vào webpack vì chúng có thể đăng ký các hook trong hệ thống xây dựng webpacks và truy cập (và sửa đổi) trình biên dịch cũng như cách nó hoạt động cũng như biên dịch. Do đó, chúng mạnh hơn, nhưng cũng khó bảo trì hơn.

Thêm câu trả lời bổ sung và đơn giản hơn.

Máy xúc lật:

Máy bốc hàng làm việc ở cấp tập tin cá nhân trong hoặc trước khi các gói được tạo ra.

Bổ sung:

Các plugin hoạt động ở cấp độ gói hoặc phân đoạn và thường hoạt động ở cuối quá trình tạo gói. Các plugin cũng có thể sửa đổi cách tạo các gói. Các plugin có khả năng kiểm soát mạnh mẽ hơn các trình tải.

Chỉ với một ví dụ, bạn có thể thấy rõ trong hình ảnh dưới đây, nơi bộ tải đang hoạt động và nơi plugin đang hoạt động -

Tham khảo: Bài báo và Hình ảnh

Về cốt lõi, webpack chỉ là một trình gói tập tin. Xem xét một kịch bản rất đơn giản (không tách mã), điều này có thể chỉ có nghĩa là các hành động sau (ở cấp độ cao):

1. tìm tệp mục nhập và tải nội dung của nó vào bộ nhớ
2. đối sánh văn bản nhất định trong nội dung và đánh giá chúng (ví dụ: @import)
3. tìm các phụ thuộc dựa trên đánh giá trước đó và làm tương tự với chúng
4. ghép tất cả chúng thành một gói trong bộ nhớ
5. ghi kết quả vào hệ thống tệp

Khi bạn kiểm tra các bước trên chặt chẽ, điều này phù hợp với những gì một trình biên dịch Java (hoặc bất kỳ trình biên dịch nào) thực hiện. Tất nhiên có sự khác biệt nhưng chúng không quan trọng để hiểu bộ tải và plugin.

Máy xúc lật:

ở đây vì webpack hứa hẹn sẽ kết hợp mọi loại tệp lại với nhau.

Vì webpack ở lõi của nó chỉ đủ khả năng để gói các tệp js, lời hứa này có nghĩa là nhóm cốt lõi của webpack phải kết hợp các luồng xây dựng cho phép mã bên ngoài chuyển đổi một loại tệp cụ thể theo cách mà webpack có thể sử dụng.

Các mã bên ngoài này được gọi là bộ tải và chúng thường chạy trong bước 1 và 3 ở trên. Do đó, vì giai đoạn mà các trình tải này cần chạy là hiển nhiên, chúng không yêu cầu hook và cũng không ảnh hưởng đến quá trình xây dựng (vì quá trình xây dựng hoặc gói chỉ xảy ra ở bước 4).

Vì vậy, Loaders chuẩn bị giai đoạn biên dịch và chúng mở rộng tính linh hoạt của trình biên dịch webpack.

Bổ sung:

ở đây vì mặc dù webpack không trực tiếp hứa hẹn đầu ra có thể thay đổi, thế giới muốn nó và webpack cho phép điều đó.

Vì webpack ở cốt lõi của nó chỉ là một gói và phải trải qua một số bước và các bước phụ để làm như vậy, các bước này có thể được sử dụng để xây dựng thêm chức năng.

Ví dụ: quy trình xây dựng sản xuất (thu nhỏ và ghi vào hệ thống tệp), là một khả năng gốc của trình biên dịch webpack, chẳng hạn, có thể được coi như một phần mở rộng của khả năng cốt lõi của nó (chỉ là gói) và có thể được coi như một plugin gốc. Nếu họ không cung cấp nó, người khác sẽ làm điều đó.

Nhìn vào plugin gốc ở trên, có vẻ như gói hoặc biên dịch webpack có thể được chia nhỏ thành quy trình đóng gói cốt lõi, cộng với rất nhiều quy trình plugin gốc mà chúng ta có thể tắt hoặc tùy chỉnh hoặc mở rộng. Điều này có nghĩa là cho phép mã bên ngoài tham gia vào quá trình đóng gói tại các điểm cụ thể mà chúng có thể chọn (được gọi là hook).

Do đó, các plugin ảnh hưởng đến đầu ra và mở rộng khả năng của trình biên dịch webpack.

Trình tải hoạt động ở cấp độ tệp . Họ có thể viết mẫu, xử lý một số mã để chuyển nó tùy theo sự thuận tiện của bạn, v.v.

Các plugin hoạt động ở cấp độ hệ thống . Chúng có thể hoạt động trên mẫu, xử lý hệ thống tệp (tên, đường dẫn), v.v.