I have a service worker that comes from my js/index.js
:
import '../scss/app.scss';
// Detect if service workers enabled
if ('serviceWorker' in navigator) {
try {
navigator.serviceWorker.register('../sw.js');
console.log('Service Worker Registered');
} catch (error) {
console.log('Service Worker Register Failed');
}
}
and my sw.js in my root directory:
const staticAssets = ['./', 'scss/app.scss', 'js/index.js'];
self.addEventListener('install', async (event) => {
const cache = await caches.open('min-static');
cache.addAll(staticAssets);
});
self.addEventListener('fetch', (event) => {
console.log('fetch');
});
Is babelized and put into the dist folder by parcel. When it's built and I go to localhost
, I open chrome tools and go into the application tab. I go into the cache storage tab and:
What's going on? Why doesn't my website get nicely cached like in The PWA Tutorial?
Shouldn't it look like this:
?
Granted, I am running everything through babel, but why isn't it working?