Giao diện dòng lệnh Workbox (nằm trong phần tử
Gói workbox-cli) bao gồm một chương trình Node.js có tên là hộp làm việc
có thể chạy từ dòng lệnh Windows, macOS hoặc tương thích với UNIX
môi trường. Về sau, workbox-cli bao bọc mô-đun bản dựng hộp công việc,
đồng thời cung cấp cách dễ dàng để tích hợp Workbox vào bản dựng dòng lệnh
với các cấu hình linh hoạt.
Cài đặt CLI
Để cài đặt CLI bằng Nút, hãy chạy lệnh sau trong thiết bị đầu cuối của bạn:
npm install workbox-cli --global
Chế độ CLI
CLI có 4 chế độ:
wizard: Hướng dẫn từng bước để thiết lập Workbox cho dự án của bạn.generateSW: Tạo một trình chạy dịch vụ hoàn chỉnh cho bạn.injectManifest: Chèn các thành phần để lưu vào bộ nhớ đệm trước vào dự án.copyLibraries: Sao chép các thư viện Workbox vào một thư mục.
wizard
Trình hướng dẫn Workbox đặt một loạt câu hỏi về thư mục cục bộ của bạn
và những tệp bạn muốn lưu trước vào bộ nhớ đệm. Câu trả lời của bạn được dùng để
tạo một tệp cấu hình có thể được sử dụng sau đó khi chạy trong
Chế độ generateSW.
Hầu hết các nhà phát triển sẽ chỉ cần chạy trình hướng dẫn hộp làm việc một lần và bạn được thoải mái để tuỳ chỉnh tệp cấu hình ban đầu đã tạo theo cách thủ công, bằng cách sử dụng bất kỳ tuỳ chọn cấu hình bản dựng nào được hỗ trợ.
Để bắt đầu chạy trình hướng dẫn:
npx workbox-cli wizard
generateSW
Bạn có thể sử dụng Workbox CLI để tạo một trình chạy dịch vụ hoàn chỉnh bằng cách sử dụng tệp cấu hình (như tệp do trình hướng dẫn tạo).
Chỉ cần chạy lệnh sau:
npx workbox-cli generateSW path/to/config.js
Các nhà phát triển hài lòng với tính năng lưu vào bộ nhớ đệm và lưu vào bộ nhớ đệm trong thời gian chạy tích hợp của Workbox
và không cần tuỳ chỉnh hành vi của trình chạy dịch vụ
bạn nên sử dụng chế độ generateSW.
Trường hợp sử dụng generateSW
- Bạn muốn lưu trước các tệp trong bộ nhớ đệm.
- Bạn có nhu cầu đơn giản về việc lưu vào bộ nhớ đệm trong thời gian chạy.
Khi nào KHÔNG nên sử dụng generateSW
- Bạn muốn sử dụng các tính năng khác của Service Worker (cụ thể là Web Push).
- Bạn muốn nhập các tập lệnh bổ sung hoặc thêm logic bổ sung cho các chiến lược lưu vào bộ nhớ đệm tuỳ chỉnh.
injectManifest
Dành cho các nhà phát triển muốn có nhiều quyền kiểm soát hơn đối với tệp trình chạy dịch vụ cuối cùng
có thể sử dụng chế độ injectManifest. Chế độ này giả định rằng bạn có một
tệp trình chạy dịch vụ hiện tại (vị trí của tệp này được chỉ định trong config.js).
Khi chạy workbox injectManifest, hệ thống sẽ tìm một chuỗi cụ thể
(precacheAndRoute(self.__WB_MANIFEST) theo mặc định) trong nguồn của bạn
tệp trình chạy dịch vụ. Phương thức này thay thế mảng trống bằng danh sách
URL để lưu trước vào bộ nhớ đệm và ghi tệp trình chạy dịch vụ vào bộ nhớ đệm
vị trí đích, dựa trên các tuỳ chọn cấu hình trong config.js.
Phần còn lại của mã trong trình chạy dịch vụ nguồn của bạn vẫn giữ nguyên.
Bạn có thể sử dụng Workbox ở chế độ này như sau:
npx workbox-cli injectManifest path/to/config.js
Trường hợp sử dụng injectManifest
- Bạn muốn có nhiều quyền kiểm soát hơn đối với trình chạy dịch vụ của mình.
- Bạn muốn lưu trước các tệp trong bộ nhớ đệm.
- Bạn cần tuỳ chỉnh định tuyến và chiến lược.
- Bạn muốn dùng trình chạy dịch vụ của mình với các tính năng nền tảng khác (ví dụ: Web Push).
Khi nào KHÔNG nên sử dụng injectManifest
- Bạn muốn biết cách dễ nhất để thêm trình chạy dịch vụ vào trang web của mình.
copyLibraries
Chế độ này rất hữu ích nếu bạn muốn sử dụng injectManifest và
muốn sử dụng các tệp thư viện Workbox được lưu trữ trên máy chủ gốc của riêng bạn
là sử dụng CDN.
Bạn chỉ cần chạy chương trình này với một đường dẫn để ghi các tệp vào:
npx workbox-cli copyLibraries third_party/workbox/
Tích hợp quy trình xây dựng
Tại sao Workbox cần tích hợp với quy trình xây dựng của tôi?
Dự án Workbox chứa một số thư viện hoạt động cùng nhau để tăng cường sức mạnh cho ứng dụng web của bạn service worker. Để sử dụng các thư viện đó một cách hiệu quả, Workbox cần được tích hợp vào của ứng dụng web. Điều này đảm bảo rằng trình chạy dịch vụ của bạn có thể lưu trước hiệu quả tất cả nội dung quan trọng của ứng dụng web vào bộ nhớ đệm và lưu giữ nội dung đó của bạn.
workbox-cli có phải là lựa chọn phù hợp cho quy trình xây dựng của tôi không?
Nếu bạn hiện đã có quy trình xây dựng hoàn toàn dựa trên
tập lệnh npm,
thì workbox-cli là lựa chọn tốt.
Nếu bạn đang sử dụng webpack làm bản dựng của mình , sau đó sử dụng workbox-webback-plugin là lựa chọn tốt hơn.
Nếu bạn đang dùng Gulp, Grunt hoặc một số công cụ tạo dựa trên Node.js khác, thì bạn có thể tích hợp workbox-build vào tập lệnh bản dựng là lựa chọn tốt hơn.
Nếu không có quy trình xây dựng nào, bạn nên tạo một quy trình trước khi sử dụng Workbox để lưu trước bất kỳ nội dung nào của bạn vào bộ nhớ đệm. Đang cố gắng cần nhớ chạy workbox-cli theo cách thủ công có thể dễ gặp lỗi và quên việc chạy nó có thể dẫn đến nội dung cũ được phân phối cho khách truy cập cũ.
Thiết lập và định cấu hình
Sau khi cài đặt workbox-cli dưới dạng một lượt phát triển
phần phụ thuộc cho dự án cục bộ của mình, bạn có thể thêm lệnh gọi vào workbox tại
cuối tập lệnh npm của quy trình xây dựng hiện tại:
Từ package.json:
{
"scripts": {
"build": "my-build-script && workbox <mode> <path/to/config.js>"
}
}
Thay thế <mode> bằng generateSW hoặc injectManifest (tuỳ thuộc
cho trường hợp sử dụng của bạn) và <path/to/config.js> với đường dẫn đến
các lựa chọn cấu hình của bạn. Cấu hình của bạn có thể đã được tạo
tự động bằng workbox wizard hoặc được điều chỉnh theo cách thủ công.
Cấu hình
Các lựa chọn mà generateSW sử dụng
Bạn có thể xem tập hợp đầy đủ các lựa chọn cấu hình trong tài liệu tham khảo.
Các lựa chọn mà injectManifest sử dụng
Bạn có thể xem tập hợp đầy đủ các lựa chọn cấu hình trong tài liệu tham khảo.