PWA ne récupère pas les fichiers en cache quand l'app est hors-ligne

Hello tout le monde,
J'essaye de créer une PWA avec le tutoriel de Grafikart (et celui du site web.dev) et j'aimerais mettre une page pour quand on est hors-ligne. J'arrive à mettre en cache les fichiers souhaités, mais lorsque je passe hors-ligne, j'obtiens des erreurs dans la console et dans la partie "network" qui me dit que l'app n'arrive pas à récuperer ces fichiers du cache. Seul mon fichier html est récuperé, mais pas ce qui va avec (ex: svg, scripts...). Il y a aussi une librairie sur un CDN ainsi que ce que CSS import qui est récuperé.

Voici un screenshot de mon cache :
[url=https://postimg.cc/1VQ3xp6H][img]https://i.postimg.cc/1VQ3xp6H/cache.png[/img][/url]

Et les erreurs que j'obtiens en étant hors-ligne sur le console et le "network" :
[url=https://postimg.cc/6TrQrmJ1][img]https://i.postimg.cc/6TrQrmJ1/console-error.png[/img][/url]
[url=https://postimg.cc/JH54RG5W][img]https://i.postimg.cc/JH54RG5W/network-error.png[/img][/url]

Enfin, voici le code de mon service worker :

const OFFLINE_VERSION = 1;
const CACHE_NAME = "offline";
const OFFLINE_URL = "offline.html";
const BASE = location.protocol + "//" + location.host;
const CACHED_FILES = [
  "https://cdn.jsdelivr.net/npm/kute.js@2.1.2/dist/kute.min.js",
  `${BASE}/src/favicon/favicon.ico`,
  `${BASE}/src/favicon/android-chrome-192x192.png`,
  `${BASE}/src/favicon/android-chrome-512x512.png`,
  `${BASE}/src/favicon/apple-touch-icon.png`,
  `${BASE}/src/favicon/favicon-16x16.png`,
  `${BASE}/src/favicon/favicon-32x32.png`,
  `${BASE}/src/svg/layered-waves.svg`,
  `${BASE}/js/background.js`,
  `${BASE}/js/animation-blob.js`
];

self.addEventListener('install', (event) => {
  event.waitUntil((async() => {
    const cache = await caches.open(CACHE_NAME);
    await Promise.all(
      [...CACHED_FILES, OFFLINE_URL].map((path) => {
        return cache.add(new Request(path, {cache: "reload"}));
      })
    );
  })());

  self.skipWaiting();
});

self.addEventListener('activate', (event) => {
  event.waitUntil((async () => {
    if ("navigationPreload" in self.registration) {
      await self.registration.navigationPreload.enable();
    }
  })());

  self.clients.claim();
});

self.addEventListener('fetch', (event) => {
  if(event.request.mode === "navigate") {
    event.respondWith((async() => {
      try {
        const preloadResponse = await event.preloadResponse;
        if(preloadResponse) {
          return preloadResponse;
        }

        return await fetch(event.request);
      } catch(e) {
        const cache = await caches.open(CACHE_NAME);
        return await cache.match(OFFLINE_URL);
      }
    })());
  }
});

Voilà tout, pourriez-vous m'expliquer donc à quoi est dû cette erreur svp ?

Merci d'avance pour vous réponses !