iT邦幫忙

2017 iT 邦幫忙鐵人賽
DAY 22
1
Modern Web

30 天 Progressive Web App 學習筆記系列 第 22

Day 22 - 30 天 Progressive Web App 學習筆記 - To-Do List 實作 PWA - sw-precache 簡介

sw-precache 是什麼?

介紹 sw-precache 是什麼之前、我們先來了解為什麼要有 sw-precache?
我們在之前的文章裡建立 Service Worker 的檔案,於 sw.js 的檔案內新增 install、activate、fetch 事件,藉由 Service Worker 的生命週期,加入對應的行為,而今天要介紹 sw-precache,分享要如何透過 sw-precache,讓你開開心心、快快樂樂更輕鬆生成 Service Worker 檔案,不需要自己新增 Service Worker 的檔案,省下更多寫 code 時間。

sw-precache 由 Google(GoogleChrome) 推出,sw-precache 的解釋,在官方文件的說明有提到:

A node module to generate service worker code that will precache specific resources so they work offline.

透過 sw-precache,你可以用最小的修改,更有效率地建立 Service Worker 檔案,完成 precache 的功能,實作網站能夠離線運作的目標。


sw-precache 如何使用?

Local build integration

npm install --save-dev sw-precache

Global command-line interface

npm install --global sw-precache

參考文件


上一篇
Day 21 - 30 天 Progressive Web App 學習筆記 - To-Do List 實作 PWA - Web App Manifest File
下一篇
Day 23 - 30 天 Progressive Web App 學習筆記 - To-Do List 實作 PWA - sw-precache 應用
系列文
30 天 Progressive Web App 學習筆記30

尚未有邦友留言

立即登入留言