feature: pwa

nuxt.config.ts

@@ -25,9 +25,38 @@ export default defineNuxtConfig({
         'highlight.js/styles/panda-syntax-dark.css',
     ],
     modules: [
+        '@vite-pwa/nuxt',
         '@nuxtjs/color-mode',
-        '@nuxtjs/i18n'
+        '@nuxtjs/i18n',
     ],
+    pwa: {
+        registerType: 'autoUpdate',
+        manifest: {
+            name: appName,
+            short_name: appName,
+            icons: [
+                {
+                    src: 'icon-black.svg',
+                    sizes: '900x900',
+                    purpose: 'any maskable',
+                }
+            ],
+        },
+        workbox: {
+            navigateFallback: '/',
+            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,
+            type: 'module',
+        }
+    },
     i18n: {
         strategy: 'no_prefix',
         locales: [