I'm trying to get my PWA to work in offline mode. So far, it's serving all the files from localhost, but the CSS doesn't render. All files requested from the cache are getting status 200. (javascript and html are fully functional) Here's my service-worker code.
self.addEventListener("install", (event) => {
event.waitUntil(
caches.open("v1").then((cache) => {
return cache.addAll([
"list of assets",
]);
})
);
});
self.addEventListener("fetch", function (event) {
event.respondWith(
caches.open("v1").then((cache) => {
if (event.request.url == "http://localhost:3000/") {
return cache
.match("http://localhost:3000/index.html")
.then((response) => {
console.log({ response });
return response;
});
} else {
try {
return cache.match(event.request).then((response) => {
console.log(response);
if (response != undefined) {
console.log({ response: "Loading asset from cache." });
return response;
} else {
let asset = fetch(event.request);
cache.add(asset);
return asset;
}
});
} catch (error) {
console.error(error);
}
}
})
);
});