fix: 🚑️ add @vite-pwa/sveltekit (#34)

closed #34

package.json

@@ -34,8 +34,10 @@
     "@tailwindcss/typography": "^0.5.7",
     "@types/node": "^18.11.9",
     "@types/unist": "^2.0.6",
+    "@types/workbox-build": "^5.0.1",
     "@typescript-eslint/eslint-plugin": "^5.42.0",
     "@typescript-eslint/parser": "^5.42.0",
+    "@vite-pwa/sveltekit": "^0.0.1",
     "autoprefixer": "^10.4.13",
     "chalk": "^5.1.2",
     "chokidar": "^3.5.3",
@@ -70,7 +72,7 @@
     "unist-util-visit": "^4.1.1",
     "unocss": "^0.46.3",
     "vite": "^3.2.2",
-    "vite-plugin-pwa": "^0.13.2",
+    "vite-plugin-pwa": "^0.13.3",
     "workbox-window": "^6.5.4"
   }
 }

src/routes/+layout.svelte

@@ -12,14 +12,15 @@
   import '../app.pcss'
 
   export let data: LayoutData
-  
+
   posts.set(data.res)
   tags.set(genTags(data.res))
   onMount(
     () =>
       !dev &&
       browser &&
       registerSW({
+        immediate: true,
         onRegistered: r => r && setInterval(async () => await r.update(), 198964),
         onRegisterError: error => console.error(error)
       })

vite.config.ts

@@ -3,7 +3,7 @@ import { defineConfig } from 'vite'
 // vite plugin
 import UnoCSS from 'unocss/vite'
 import { presetTagify, presetIcons, extractorSvelte } from 'unocss'
-import { VitePWA } from 'vite-plugin-pwa'
+import { SvelteKitPWA } from '@vite-pwa/sveltekit'
 import { sveltekit } from '@sveltejs/kit/vite'
 // postcss & tailwindcss
 import TailwindCSS from 'tailwindcss'
@@ -39,13 +39,11 @@ export default defineConfig({
         presetIcons({ scale: 1.5 })
       ]
     }),
-    VitePWA({
-      srcDir: './build',
-      outDir: './.svelte-kit/output/client',
+    sveltekit(),
+    SvelteKitPWA({
       registerType: 'autoUpdate',
-      scope: '/',
-      base: '/'
-    }),
-    sveltekit()
+      manifest: false,
+      scope: '/'
+    })
   ]
 })