@vite-pwa/nuxt 0.0.10 → 0.1.0

package/README.md

@@ -40,7 +40,8 @@ Zero-config PWA Plugin for Nuxt 3
 - ⚙️ **Stale-while-revalidate**: automatic reload when new content is available
 - ✨ **Static assets handling**: configure static assets for offline support
 - 🐞 **Development Support**: debug your custom service worker logic as you develop your application
-- 🛠️ **Versatile**: integration with meta frameworks:  [îles](https://github.com/ElMassimo/iles), [SvelteKit](https://github.com/sveltejs/kit), [VitePress](https://github.com/vuejs/vitepress), [Astro](https://github.com/withastro/astro), and [Nuxt 3](https://github.com/nuxt/nuxt)
+- 🛠️ **Versatile**: integration with meta frameworks: [îles](https://github.com/ElMassimo/iles), [SvelteKit](https://github.com/sveltejs/kit), [VitePress](https://github.com/vuejs/vitepress), [Astro](https://github.com/withastro/astro), and [Nuxt 3](https://github.com/nuxt/nuxt)
+- 💥 PWA Assets Generator: generate all the PWA assets from a single command and a single source image
 
 ## 📦 Install
 

package/dist/module.json

@@ -1,5 +1,5 @@
 {
   "name": "pwa",
   "configKey": "pwa",
-  "version": "0.0.10"
+  "version": "0.1.0"
 }

package/dist/module.mjs

@@ -98,7 +98,7 @@ const module = defineNuxtModule({
       filePath: resolver.resolve("./runtime/VitePwaManifest")
     });
     nuxt.hook("prepare:types", ({ references }) => {
-      references.push({ types: "vite-plugin-pwa/client" });
+      references.push({ types: "vite-plugin-pwa/vue" });
       references.push({ types: "vite-plugin-pwa/info" });
     });
     const manifestDir = join(nuxt.options.buildDir, "manifests");
@@ -162,6 +162,14 @@ const module = defineNuxtModule({
             return;
           viteServer.middlewares.stack.push({ route: workbox, handle: emptyHandle });
         });
+        if (options.devOptions?.suppressWarnings) {
+          const suppressWarnings = `${nuxt.options.app.baseURL}suppress-warnings.js`;
+          nuxt.hook("vite:serverCreated", (viteServer, { isServer }) => {
+            if (isServer)
+              return;
+            viteServer.middlewares.stack.push({ route: suppressWarnings, handle: emptyHandle });
+          });
+        }
       }
     } else {
       if (!options.disable && options.registerWebManifestInRouteRules) {

package/package.json

@@ -1,8 +1,8 @@
 {
   "name": "@vite-pwa/nuxt",
   "type": "module",
-  "version": "0.0.10",
-  "packageManager": "pnpm@8.6.0",
+  "version": "0.1.0",
+  "packageManager": "pnpm@8.6.1",
   "description": "Zero-config PWA for Nuxt 3",
   "author": "antfu <anthonyfu117@hotmail.com>",
   "license": "MIT",
@@ -55,25 +55,25 @@
     "test:with-build": "nr dev:prepare && nr prepack && nr test"
   },
   "peerDependencies": {
-    "@nuxt/kit": "^3.0.0",
-    "vite-plugin-pwa": "^0.14.0"
+    "@nuxt/kit": "^3.5.3",
+    "vite-plugin-pwa": ">=0.16.3 <1"
   },
   "dependencies": {
-    "@nuxt/kit": "^3.5.2",
-    "vite-plugin-pwa": "^0.16.1"
+    "@nuxt/kit": "^3.5.3",
+    "vite-plugin-pwa": ">=0.16.3 <1"
   },
   "devDependencies": {
-    "@antfu/eslint-config": "^0.39.4",
-    "@antfu/ni": "^0.21.3",
+    "@antfu/eslint-config": "^0.39.5",
+    "@antfu/ni": "^0.21.4",
     "@nuxt/module-builder": "^0.4.0",
-    "@nuxt/schema": "^3.5.2",
-    "@nuxt/test-utils": "^3.5.2",
-    "@playwright/test": "^1.34.3",
-    "bumpp": "^8.2.1",
-    "eslint": "^8.41.0",
-    "nuxt": "^3.5.2",
+    "@nuxt/schema": "^3.5.3",
+    "@nuxt/test-utils": "^3.5.3",
+    "@playwright/test": "^1.35.0",
+    "bumpp": "^9.1.1",
+    "eslint": "^8.42.0",
+    "nuxt": "^3.5.3",
     "serve": "^14.2.0",
-    "typescript": "^5.0.4",
+    "typescript": "^5.1.3",
     "vitest": "^0.31.4"
   },
   "build": {

package/templates/pwa.client.ts

@@ -1,136 +1,136 @@
-import { ref, reactive, nextTick, type UnwrapNestedRefs } from 'vue'
-import { useRegisterSW } from 'virtual:pwa-register/vue'
-import { defineNuxtPlugin } from '#imports'
-
-import { type PwaInjection } from '@vite-pwa/nuxt'
-
-const options: { periodicSyncForUpdates: number; installPrompt?: string } = <%= JSON.stringify(options) %>
-
-export default defineNuxtPlugin(() => {
-  const registrationError = ref(false)
-  const swActivated = ref(false)
-  const showInstallPrompt = ref(false)
-  const hideInstall = ref(!options.installPrompt ? true : localStorage.getItem(options.installPrompt) === 'true')
-
-  // https://thomashunter.name/posts/2021-12-11-detecting-if-pwa-twa-is-installed
-  const ua = navigator.userAgent
-  const ios = ua.match(/iPhone|iPad|iPod/)
-  const standalone = window.matchMedia('(display-mode: standalone)').matches
-  const isInstalled = !!(standalone || (ios && !ua.match(/Safari/)))
-
-  let swRegistration: ServiceWorkerRegistration | undefined
-
-  const getSWRegistration = () => swRegistration
-
-  const registerPeriodicSync = (swUrl: string, r: ServiceWorkerRegistration, timeout: number) => {
-    setInterval(async () => {
-      if (('connection' in navigator) && !navigator.onLine)
-        return
-
-      const resp = await fetch(swUrl, {
-        cache: 'no-store',
-        headers: {
-          'cache': 'no-store',
-          'cache-control': 'no-cache',
-        },
-      })
-
-      if (resp?.status === 200)
-        await r.update()
-    }, timeout)
-  }
-
-  const {
-    offlineReady, needRefresh, updateServiceWorker,
-  } = useRegisterSW({
-    immediate: true,
-    onRegisterError() {
-      registrationError.value = true
-    },
-    onRegisteredSW(swUrl, r) {
-      swRegistration = r
-      const timeout = options.periodicSyncForUpdates
-      if (timeout > 0) {
-        // should add support in pwa plugin
-        if (r?.active?.state === 'activated') {
-          swActivated.value = true
-          registerPeriodicSync(swUrl, r, timeout * 1000)
-        }
-        else if (r?.installing) {
-          r.installing.addEventListener('statechange', (e) => {
-            const sw = e.target as ServiceWorker
-            swActivated.value = sw.state === 'activated'
-            if (swActivated.value)
-              registerPeriodicSync(swUrl, r, timeout * 1000)
-          })
-        }
-      }
-    },
-  })
-
-  const cancelPrompt = async () => {
-    offlineReady.value = false
-    needRefresh.value = false
-  }
-
-  let install: () => Promise<void> = () => Promise.resolve()
-  let cancelInstall: () => void = () => {}
-
-  if (!hideInstall.value) {
-    type InstallPromptEvent = Event & {
-      prompt: () => void
-      userChoice: Promise<{ outcome: 'dismissed' | 'accepted' }>
-    }
-
-    let deferredPrompt: InstallPromptEvent | undefined
-
-    const beforeInstallPrompt = (e: Event) => {
-      e.preventDefault()
-      deferredPrompt = e as InstallPromptEvent
-      showInstallPrompt.value = true
-    }
-    window.addEventListener('beforeinstallprompt', beforeInstallPrompt)
-    window.addEventListener('appinstalled', () => {
-      deferredPrompt = undefined
-      showInstallPrompt.value = false
-    })
-
-    cancelInstall = () => {
-      deferredPrompt = undefined
-      showInstallPrompt.value = false
-      window.removeEventListener('beforeinstallprompt', beforeInstallPrompt)
-      hideInstall.value = true
-      localStorage.setItem(options.installPrompt!, 'true')
-    }
-
-    install = async () => {
-      if (!showInstallPrompt.value || !deferredPrompt) {
-        showInstallPrompt.value = false
-        return
-      }
-
-      showInstallPrompt.value = false
-      await nextTick()
-      deferredPrompt.prompt()
-      await deferredPrompt.userChoice
-    }
-  }
-
-  return {
-    provide: {
-      pwa: reactive({
-        isInstalled,
-        showInstallPrompt,
-        cancelInstall,
-        install,
-        swActivated,
-        registrationError,
-        offlineReady,
-        needRefresh,
-        updateServiceWorker,
-        cancelPrompt,
-        getSWRegistration,
-      }) satisfies UnwrapNestedRefs<PwaInjection>,
-    },
-  }
-})
+import { ref, reactive, nextTick, type UnwrapNestedRefs } from 'vue'
+import { useRegisterSW } from 'virtual:pwa-register/vue'
+import { defineNuxtPlugin } from '#imports'
+
+import { type PwaInjection } from '@vite-pwa/nuxt'
+
+const options: { periodicSyncForUpdates: number; installPrompt?: string } = <%= JSON.stringify(options) %>
+
+export default defineNuxtPlugin(() => {
+  const registrationError = ref(false)
+  const swActivated = ref(false)
+  const showInstallPrompt = ref(false)
+  const hideInstall = ref(!options.installPrompt ? true : localStorage.getItem(options.installPrompt) === 'true')
+
+  // https://thomashunter.name/posts/2021-12-11-detecting-if-pwa-twa-is-installed
+  const ua = navigator.userAgent
+  const ios = ua.match(/iPhone|iPad|iPod/)
+  const standalone = window.matchMedia('(display-mode: standalone)').matches
+  const isInstalled = !!(standalone || (ios && !ua.match(/Safari/)))
+
+  let swRegistration: ServiceWorkerRegistration | undefined
+
+  const getSWRegistration = () => swRegistration
+
+  const registerPeriodicSync = (swUrl: string, r: ServiceWorkerRegistration, timeout: number) => {
+    setInterval(async () => {
+      if (('connection' in navigator) && !navigator.onLine)
+        return
+
+      const resp = await fetch(swUrl, {
+        cache: 'no-store',
+        headers: {
+          'cache': 'no-store',
+          'cache-control': 'no-cache',
+        },
+      })
+
+      if (resp?.status === 200)
+        await r.update()
+    }, timeout)
+  }
+
+  const {
+    offlineReady, needRefresh, updateServiceWorker,
+  } = useRegisterSW({
+    immediate: true,
+    onRegisterError() {
+      registrationError.value = true
+    },
+    onRegisteredSW(swUrl, r) {
+      swRegistration = r
+      const timeout = options.periodicSyncForUpdates
+      if (timeout > 0) {
+        // should add support in pwa plugin
+        if (r?.active?.state === 'activated') {
+          swActivated.value = true
+          registerPeriodicSync(swUrl, r, timeout * 1000)
+        }
+        else if (r?.installing) {
+          r.installing.addEventListener('statechange', (e) => {
+            const sw = e.target as ServiceWorker
+            swActivated.value = sw.state === 'activated'
+            if (swActivated.value)
+              registerPeriodicSync(swUrl, r, timeout * 1000)
+          })
+        }
+      }
+    },
+  })
+
+  const cancelPrompt = async () => {
+    offlineReady.value = false
+    needRefresh.value = false
+  }
+
+  let install: () => Promise<void> = () => Promise.resolve()
+  let cancelInstall: () => void = () => {}
+
+  if (!hideInstall.value) {
+    type InstallPromptEvent = Event & {
+      prompt: () => void
+      userChoice: Promise<{ outcome: 'dismissed' | 'accepted' }>
+    }
+
+    let deferredPrompt: InstallPromptEvent | undefined
+
+    const beforeInstallPrompt = (e: Event) => {
+      e.preventDefault()
+      deferredPrompt = e as InstallPromptEvent
+      showInstallPrompt.value = true
+    }
+    window.addEventListener('beforeinstallprompt', beforeInstallPrompt)
+    window.addEventListener('appinstalled', () => {
+      deferredPrompt = undefined
+      showInstallPrompt.value = false
+    })
+
+    cancelInstall = () => {
+      deferredPrompt = undefined
+      showInstallPrompt.value = false
+      window.removeEventListener('beforeinstallprompt', beforeInstallPrompt)
+      hideInstall.value = true
+      localStorage.setItem(options.installPrompt!, 'true')
+    }
+
+    install = async () => {
+      if (!showInstallPrompt.value || !deferredPrompt) {
+        showInstallPrompt.value = false
+        return
+      }
+
+      showInstallPrompt.value = false
+      await nextTick()
+      deferredPrompt.prompt()
+      await deferredPrompt.userChoice
+    }
+  }
+
+  return {
+    provide: {
+      pwa: reactive({
+        isInstalled,
+        showInstallPrompt,
+        cancelInstall,
+        install,
+        swActivated,
+        registrationError,
+        offlineReady,
+        needRefresh,
+        updateServiceWorker,
+        cancelPrompt,
+        getSWRegistration,
+      }) satisfies UnwrapNestedRefs<PwaInjection>,
+    },
+  }
+})