service worker not working for .tsx/.jsx file in react vite.why?

console.log("service worker");

const OFFLINE_ASSETS = [
  "/",
  "/src/main.tsx",
  "/vite.svg",
  `https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcRmCy16nhIbV3pI1qLYHMJKwbH2458oiC9EmA&s`,
];

const addResourcesToCache = async (resources) => {
  const cache = await caches.open("v1");
  await cache.addAll(resources);
};

self.addEventListener("install", (e) => {
  console.log("installing");
  e.waitUntil(addResourcesToCache(OFFLINE_ASSETS));
});

const cacheFirst = async (req) => {
  const responseFromCache = await caches.match(req);
  if (responseFromCache) {
    return responseFromCache;
  }

  return fetch(req);
};

self.addEventListener("fetch", (event) => {
  event.respondWith(cacheFirst(event.request));
});

it’s displaying “index.html” on “/” which ii should . the svgs and images link are also working but only main.tsx and such arent working when i close my server . why ?
its on react-ts on vite