fix: change sw

public/my-sw.js

@@ -0,0 +1,18 @@
+if ('serviceWorker' in navigator) {
+  window.addEventListener('load', () => {
+    navigator.serviceWorker
+      .getRegistrations()
+      .then((registrations) => {
+        for (const registration of registrations) {
+          registration.unregister();
+        }
+      })
+      .then(() => {
+        navigator.serviceWorker
+          .register('/serviceWorker.js')
+          .then((registration) => {
+            registration.waiting.postMessage({ type: 'SKIP_WAITING' });
+          });
+      });
+  });
+}

public/sw.js

@@ -0,0 +1,18 @@
+if ('serviceWorker' in navigator) {
+  window.addEventListener('load', () => {
+    navigator.serviceWorker
+      .getRegistrations()
+      .then((registrations) => {
+        for (const registration of registrations) {
+          registration.unregister();
+        }
+      })
+      .then(() => {
+        navigator.serviceWorker
+          .register('/serviceWorker.js')
+          .then((registration) => {
+            registration.waiting.postMessage({ type: 'SKIP_WAITING' });
+          });
+      });
+  });
+}

readme.md

@@ -202,7 +202,7 @@ auth_check: "/auth-check", // HOC적용이 힘든 케이스에 사용할 검증
 ┃ ┣ 📜logo.svg # 미사용
 ┃ ┣ 📜react-app-env.d.ts # 미사용
 ┃ ┣ 📜reportWebVitals.ts # 미사용
-┃ ┣ 📜my-sw.ts # PWA를 위한 서비스 워커
+┃ ┣ 📜serviceWorker.ts # PWA를 위한 서비스 워커
 ┃ ┣ 📜serviceWorkerRegistration.ts # PWA를 위한 서비스 워커
 ┃ ┣ 📜setupTests.ts # 미사용
 ┃ ┗ 📜version.js # 버전 커밋

src/common/hooks/useUpdate.tsx

@@ -8,6 +8,7 @@ export function useUpdate() {
   const { updateServiceWorker } = useRegisterSW({
     onRegistered: (r) => {
       if (!r) return;
+
       r.update();
       setInterval(() => {
         r.update();

src/serviceWorker.ts

@@ -0,0 +1,16 @@
+import { clientsClaim } from 'workbox-core';
+import { cleanupOutdatedCaches, precacheAndRoute } from 'workbox-precaching';
+
+declare let self: ServiceWorkerGlobalScope;
+
+cleanupOutdatedCaches();
+
+precacheAndRoute(self.__WB_MANIFEST);
+
+self.addEventListener('message', (event) => {
+  if (event.data && event.data.type === 'SKIP_WAITING') {
+    console.log('here');
+    self.skipWaiting();
+    clientsClaim();
+  }
+});

vite.config.js

@@ -25,7 +25,7 @@ export default defineConfig({
         globPatterns: ['**/*.{js,css,html,ico,png,svg,woff2,otf}'],
       },
       srcDir: 'src',
-      filename: 'my-sw.ts',
+      filename: 'serviceWorker.ts',
       manifestFilename: 'manifest.json',
     }),
   ],