From 239524c212d67b287427f7aa40bddd2c20eec1dc Mon Sep 17 00:00:00 2001
From: Aresn <admin@aresn.com>
Date: Wed, 15 May 2024 17:07:10 +0800
Subject: [PATCH] a

---
 app.vue              |  1 +
 nuxt.config.ts       | 51 +++++++++++++++++++++++++++++++++++++++++++-
 service-worker/sw.ts | 26 ++++++++++++++++++++++
 3 files changed, 77 insertions(+), 1 deletion(-)
 create mode 100644 service-worker/sw.ts

diff --git a/app.vue b/app.vue
index d7429f2..03eac92 100644
--- a/app.vue
+++ b/app.vue
@@ -1,4 +1,5 @@
 <template>
+    <NuxtPwaManifest />
     <NuxtLayout name="default">
         <NuxtPage />
     </NuxtLayout>
diff --git a/nuxt.config.ts b/nuxt.config.ts
index 98f90a7..d08cdbe 100644
--- a/nuxt.config.ts
+++ b/nuxt.config.ts
@@ -1,4 +1,5 @@
 // https://nuxt.com/docs/api/configuration/nuxt-config
+const sw = process.env.SW === 'true'
 export default defineNuxtConfig({
     devtools: {
         enabled: false
@@ -6,5 +7,53 @@ export default defineNuxtConfig({
     modules: [
         '@vite-pwa/nuxt',
         '@nuxt/ui'
-    ]
+    ],
+    pwa: {
+        strategies: sw ? 'injectManifest' : 'generateSW',
+        srcDir: sw ? 'service-worker' : undefined,
+        filename: sw ? 'sw.ts' : undefined,
+        registerType: 'autoUpdate',
+        manifest: {
+            name: 'Nuxt Vite PWA',
+            short_name: 'NuxtVitePWA',
+            theme_color: '#ffffff',
+            icons: [
+                {
+                    src: 'pwa-192x192.png',
+                    sizes: '192x192',
+                    type: 'image/png',
+                },
+                {
+                    src: 'pwa-512x512.png',
+                    sizes: '512x512',
+                    type: 'image/png',
+                },
+                {
+                    src: 'pwa-512x512.png',
+                    sizes: '512x512',
+                    type: 'image/png',
+                    purpose: 'any maskable',
+                },
+            ],
+        },
+        workbox: {
+            globPatterns: ['**/*.{js,css,html,png,svg,ico}'],
+        },
+        injectManifest: {
+            globPatterns: ['**/*.{js,css,html,png,svg,ico}'],
+        },
+        client: {
+            installPrompt: true,
+            // you don't need to include this: only for testing purposes
+            // if enabling periodic sync for update use 1 hour or so (periodicSyncForUpdates: 3600)
+            periodicSyncForUpdates: 20,
+        },
+        devOptions: {
+            enabled: true,
+            suppressWarnings: true,
+            navigateFallback: '/',
+            navigateFallbackAllowlist: [/^\/$/],
+            type: 'module',
+        },
+    },
 })
\ No newline at end of file
diff --git a/service-worker/sw.ts b/service-worker/sw.ts
new file mode 100644
index 0000000..f77cb84
--- /dev/null
+++ b/service-worker/sw.ts
@@ -0,0 +1,26 @@
+/// <reference lib="WebWorker" />
+/// <reference types="vite/client" />
+import { cleanupOutdatedCaches, createHandlerBoundToURL, precacheAndRoute } from 'workbox-precaching'
+import { clientsClaim } from 'workbox-core'
+import { NavigationRoute, registerRoute } from 'workbox-routing'
+
+declare let self: ServiceWorkerGlobalScope
+
+// self.__WB_MANIFEST is default injection point
+precacheAndRoute(self.__WB_MANIFEST)
+
+// clean old assets
+cleanupOutdatedCaches()
+
+let allowlist: undefined | RegExp[]
+if (import.meta.env.DEV)
+  allowlist = [/^\/$/]
+
+// to allow work offline
+registerRoute(new NavigationRoute(
+  createHandlerBoundToURL('/'),
+  { allowlist },
+))
+
+self.skipWaiting()
+clientsClaim()
-- 
GitLab