@vite-pwa/nuxt 1.0.6 → 1.0.7

package/dist/chunks/pwa-icons.mjs

@@ -1,19 +1,20 @@
-import { readFile } from 'node:fs/promises';
-import { resolve, relative, basename } from 'node:path';
+import fs from 'node:fs';
+import { readFile, access } from 'node:fs/promises';
 import process from 'node:process';
 import { instructions } from '@vite-pwa/assets-generator/api/instructions';
 import { loadConfig } from '@vite-pwa/assets-generator/config';
-import { p as pwaIcons, g as generatePwaImageType } from '../shared/nuxt.5d94182e.mjs';
+import { relative, basename, resolve } from 'pathe';
+import { p as pwaIcons, g as generatePwaImageType } from '../shared/nuxt.1f661fa7.mjs';
 import '@nuxt/kit';
+import 'node:path';
 import 'vite-plugin-pwa';
 import 'node:crypto';
-import 'node:fs';
-import 'pathe';
 
-async function preparePWAIconTypes(options, nuxt) {
+async function preparePWAIconTypes(ctx) {
+  const { options, nuxt } = ctx;
   if (!options.pwaAssets || options.pwaAssets.disabled)
     return;
-  const configuration = resolvePWAAssetsOptions(options);
+  const configuration = await resolvePWAAssetsOptions(ctx);
   if (!configuration || configuration.disabled)
     return;
   const root = nuxt.options.vite.root ?? process.cwd();
@@ -30,13 +31,13 @@ async function preparePWAIconTypes(options, nuxt) {
   if (Array.isArray(images) && (!images.length || images.length > 1))
     return;
   const useImage = Array.isArray(images) ? images[0] : images;
-  const imageFile = resolve(root, useImage);
-  const publicDir = resolve(root, nuxt.options.dir.public ?? "public");
+  const imageFile = await tryToResolveImage(ctx, useImage);
+  const publicDir = ctx.publicDirFolder;
   const imageName = relative(publicDir, imageFile);
   const xhtml = userHeadLinkOptions?.xhtml === true;
   const includeId = userHeadLinkOptions?.includeId === true;
   const assetsInstructions = await instructions({
-    imageResolver: () => readFile(resolve(root, useImage)),
+    imageResolver: () => readFile(imageFile),
     imageName,
     preset,
     faviconPreset: userHeadLinkOptions?.preset,
@@ -57,37 +58,56 @@ async function preparePWAIconTypes(options, nuxt) {
       apple: appleNames,
       appleSplashScreen: appleSplashScreenNames
     }),
-    transparent: generatePwaImageType("PwaTransparentImage", transparentNames),
-    maskable: generatePwaImageType("PwaMaskableImage", maskableNames),
-    favicon: generatePwaImageType("PwaFaviconImage", faviconNames),
-    apple: generatePwaImageType("PwaAppleImage", appleNames),
-    appleSplashScreen: generatePwaImageType("PwaAppleSplashScreenImage", appleSplashScreenNames)
+    transparent: generatePwaImageType("PwaTransparentImage", ctx.nuxt4, transparentNames),
+    maskable: generatePwaImageType("PwaMaskableImage", ctx.nuxt4, maskableNames),
+    favicon: generatePwaImageType("PwaFaviconImage", ctx.nuxt4, faviconNames),
+    apple: generatePwaImageType("PwaAppleImage", ctx.nuxt4, appleNames),
+    appleSplashScreen: generatePwaImageType("PwaAppleSplashScreenImage", ctx.nuxt4, appleSplashScreenNames)
   };
   if (nuxt.options.dev && nuxt.options.ssr) {
     sources.forEach((source) => nuxt.options.watch.push(source.replace(/\\/g, "/")));
   }
   return dts;
 }
-function resolvePWAAssetsOptions(options) {
+async function resolvePWAAssetsOptions(ctx) {
+  const { options, nuxt } = ctx;
   if (!options.pwaAssets)
     return;
   const {
     disabled: useDisabled,
     config,
     preset,
-    image = "public/favicon.svg",
+    image,
     htmlPreset = "2023",
     overrideManifestIcons = false,
     includeHtmlHeadLinks = true,
     injectThemeColor = true,
     integration
   } = options.pwaAssets ?? {};
-  const disabled = useDisabled || !config && !preset;
+  const disabled = !(useDisabled === true) ? false : !config && !preset;
+  let useImage;
+  if (image) {
+    useImage = await tryToResolveImage(ctx, image);
+  } else {
+    useImage = resolve(ctx.publicDirFolder, "favicon.svg");
+  }
+  useImage = relative(nuxt.options.srcDir, useImage);
+  options.pwaAssets = {
+    disabled,
+    config: disabled || !config ? false : config,
+    preset: disabled || config ? false : preset ?? "minimal-2023",
+    image: useImage,
+    htmlPreset,
+    overrideManifestIcons,
+    includeHtmlHeadLinks,
+    injectThemeColor,
+    integration
+  };
   return {
     disabled,
     config: disabled || !config ? false : config,
     preset: disabled || config ? false : preset ?? "minimal-2023",
-    images: [image],
+    images: [useImage],
     htmlPreset,
     overrideManifestIcons,
     includeHtmlHeadLinks,
@@ -109,5 +129,27 @@ async function loadConfiguration(root, pwaAssets) {
     typeof pwaAssets.config === "boolean" ? root : { config: pwaAssets.config }
   );
 }
+async function checkFileExists(pathname) {
+  try {
+    await access(pathname, fs.constants.R_OK);
+  } catch {
+    return false;
+  }
+  return true;
+}
+async function tryToResolveImage(ctx, imageName) {
+  for (const image of [
+    // rootDir
+    resolve(ctx.nuxt.options.rootDir, imageName),
+    // srcDir
+    resolve(ctx.nuxt.options.srcDir, imageName),
+    // publicDir
+    resolve(ctx.publicDirFolder, imageName)
+  ]) {
+    if (await checkFileExists(image))
+      return image;
+  }
+  throw new Error(`PWA Assets image '${imageName}' cannot be resolved!`);
+}
 
 export { preparePWAIconTypes };

package/dist/module.json

@@ -4,7 +4,7 @@
   "compatibility": {
     "nuxt": ">=3.6.5"
   },
-  "version": "1.0.6",
+  "version": "1.0.7",
   "builder": {
     "@nuxt/module-builder": "0.8.3",
     "unbuild": "2.0.0"

package/dist/module.mjs

@@ -1,5 +1,5 @@
 import '@nuxt/kit';
-export { m as default } from './shared/nuxt.5d94182e.mjs';
+export { m as default } from './shared/nuxt.1f661fa7.mjs';
 import 'node:fs/promises';
 import 'node:path';
 import 'vite-plugin-pwa';

package/dist/runtime/components/nuxt4/PwaAppleImage.d.ts

@@ -0,0 +1,4 @@
+import type { PwaAppleSplashScreenImageProps } from '#build/pwa-icons/PwaAppleSplashScreenImage.d.ts';
+export type { PwaAppleSplashScreenImageProps };
+declare const _default: import("vue").DefineComponent<PwaAppleSplashScreenImageProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<PwaAppleSplashScreenImageProps>, {}, {}>;
+export default _default;

package/dist/runtime/components/nuxt4/PwaAppleImage.js

@@ -0,0 +1,15 @@
+import { defineComponent, h } from "#imports";
+import { useAppleSplashScreenPwaIcon } from "#pwa";
+export default defineComponent({
+  name: "PwaAppleImage",
+  inheritAttrs: false,
+  setup(_, { attrs = {} }) {
+    const { icon } = useAppleSplashScreenPwaIcon(attrs);
+    return () => {
+      const data = icon.value;
+      if (!data)
+        return;
+      return h("img", data);
+    };
+  }
+});

package/dist/runtime/components/nuxt4/PwaAppleSplashScreenImage.d.ts

@@ -0,0 +1,4 @@
+import type { PwaAppleImageProps } from '#build/pwa-icons/PwaAppleImage.d.ts';
+export type { PwaAppleImageProps };
+declare const _default: import("vue").DefineComponent<PwaAppleImageProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<PwaAppleImageProps>, {}, {}>;
+export default _default;

package/dist/runtime/components/nuxt4/PwaAppleSplashScreenImage.js

@@ -0,0 +1,15 @@
+import { defineComponent, h } from "#imports";
+import { useApplePwaIcon } from "#pwa";
+export default defineComponent({
+  name: "PwaAppleImage",
+  inheritAttrs: false,
+  setup(_, { attrs = {} }) {
+    const { icon } = useApplePwaIcon(attrs);
+    return () => {
+      const data = icon.value;
+      if (!data)
+        return;
+      return h("img", data);
+    };
+  }
+});

package/dist/runtime/components/nuxt4/PwaFaviconImage.d.ts

@@ -0,0 +1,4 @@
+import type { PwaFaviconImageProps } from '#build/pwa-icons/PwaFaviconImage.d.ts';
+export type { PwaFaviconImageProps };
+declare const _default: import("vue").DefineComponent<PwaFaviconImageProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<PwaFaviconImageProps>, {}, {}>;
+export default _default;

package/dist/runtime/components/nuxt4/PwaFaviconImage.js

@@ -0,0 +1,15 @@
+import { defineComponent, h } from "#imports";
+import { useFaviconPwaIcon } from "#pwa";
+export default defineComponent({
+  name: "PwaFaviconImage",
+  inheritAttrs: false,
+  setup(_, { attrs = {} }) {
+    const { icon } = useFaviconPwaIcon(attrs);
+    return () => {
+      const data = icon.value;
+      if (!data)
+        return;
+      return h("img", data);
+    };
+  }
+});

package/dist/runtime/components/nuxt4/PwaMaskableImage.d.ts

@@ -0,0 +1,4 @@
+import type { PwaMaskableImageProps } from '#build/pwa-icons/PwaMaskableImage.d.ts';
+export type { PwaMaskableImageProps };
+declare const _default: import("vue").DefineComponent<PwaMaskableImageProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<PwaMaskableImageProps>, {}, {}>;
+export default _default;

package/dist/runtime/components/nuxt4/PwaMaskableImage.js

@@ -0,0 +1,15 @@
+import { defineComponent, h } from "#imports";
+import { useMaskablePwaIcon } from "#pwa";
+export default defineComponent({
+  name: "PwaMaskableImage",
+  inheritAttrs: false,
+  setup(_, { attrs = {} }) {
+    const { icon } = useMaskablePwaIcon(attrs);
+    return () => {
+      const data = icon.value;
+      if (!data)
+        return;
+      return h("img", data);
+    };
+  }
+});

package/dist/runtime/components/nuxt4/PwaTransparentImage.d.ts

@@ -0,0 +1,4 @@
+import type { PwaTransparentImageProps } from '#build/pwa-icons/PwaTransparentImage.d.ts';
+export type { PwaTransparentImageProps };
+declare const _default: import("vue").DefineComponent<PwaTransparentImageProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<PwaTransparentImageProps>, {}, {}>;
+export default _default;

package/dist/runtime/components/nuxt4/PwaTransparentImage.js

@@ -0,0 +1,15 @@
+import { defineComponent, h } from "#imports";
+import { useTransparentPwaIcon } from "#pwa";
+export default defineComponent({
+  name: "PwaTransparentImage",
+  inheritAttrs: false,
+  setup(_, { attrs = {} }) {
+    const { icon } = useTransparentPwaIcon(attrs);
+    return () => {
+      const data = icon.value;
+      if (!data)
+        return;
+      return h("img", data);
+    };
+  }
+});

package/dist/runtime/composables/index.d.ts

@@ -28,7 +28,7 @@ export interface PWAIcon {
     nonce?: string;
     [key: string]: any;
 }
-type PWAImageType<T> = T extends 'transparent' ? PwaTransparentImageProps['image'] | (Omit<PWAImage, 'image'> & {
+export type PWAImageType<T> = T extends 'transparent' ? PwaTransparentImageProps['image'] | (Omit<PWAImage, 'image'> & {
     image: PwaTransparentImageProps['image'];
 }) : T extends 'maskable' ? PwaMaskableImageProps['image'] | Omit<PWAImage, 'image'> & {
     image: PwaMaskableImageProps['image'];
@@ -60,4 +60,3 @@ export declare function useAppleSplashScreenPwaIcon(image: AppleSplashScreenImag
     icon: import("vue").ComputedRef<PWAIcon | undefined>;
 };
 export declare function usePWA(): UnwrapNestedRefs<PwaInjection> | undefined;
-export {};

package/dist/shared/{nuxt.5d94182e.mjs → nuxt.1f661fa7.mjs}

@@ -1,4 +1,4 @@
-import { addPluginTemplate, addTypeTemplate, addImports, createResolver, getNuxtVersion, addPlugin, addComponent, extendWebpackConfig, addDevServerHandler, defineNuxtModule } from '@nuxt/kit';
+import { addPluginTemplate, addTypeTemplate, addImports, createResolver, getNuxtVersion, resolveAlias, addPlugin, addComponent, extendWebpackConfig, addDevServerHandler, defineNuxtModule } from '@nuxt/kit';
 import { lstat, writeFile, mkdir } from 'node:fs/promises';
 import { join } from 'node:path';
 import { VitePWA } from 'vite-plugin-pwa';
@@ -6,9 +6,10 @@ import { createHash } from 'node:crypto';
 import { createReadStream } from 'node:fs';
 import { resolve } from 'pathe';
 
-const version = "1.0.6";
+const version = "1.0.7";
 
-function configurePWAOptions(nuxt3_8, options, nuxt, nitroConfig) {
+function configurePWAOptions(ctx, nitroConfig) {
+  const { nuxt3_8, options, nuxt } = ctx;
   if (!options.outDir) {
     const publicDir = nitroConfig.output?.publicDir ?? nuxt.options.nitro?.output?.publicDir;
     options.outDir = publicDir ? resolve(publicDir) : resolve(nuxt.options.buildDir, "../.output/public");
@@ -81,7 +82,7 @@ function configurePWAOptions(nuxt3_8, options, nuxt, nitroConfig) {
   if (options.pwaAssets) {
     options.pwaAssets.integration = {
       baseUrl: nuxt.options.app.baseURL ?? "/",
-      publicDir: nuxt.options.dir.public,
+      publicDir: ctx.publicDirFolder,
       outDir: options.outDir
     };
   }
@@ -143,19 +144,19 @@ function createManifestTransform(base, publicFolder, appManifestFolder) {
   };
 }
 
-function addPwaTypeTemplate(filename, content) {
+function addPwaTypeTemplate(filename, isNuxt4, content) {
   if (content?.length) {
-    addTypeTemplate({
+    return addTypeTemplate({
       write: true,
       filename: `pwa-icons/${filename}.d.ts`,
       getContents: () => content
-    });
+    }).dst;
   } else {
-    addTypeTemplate({
+    return addTypeTemplate({
       write: true,
-      getContents: () => generatePwaImageType(filename),
+      getContents: () => generatePwaImageType(filename, isNuxt4),
       filename: `pwa-icons/${filename}.d.ts`
-    });
+    }).dst;
   }
 }
 function pwaIcons(types) {
@@ -194,8 +195,22 @@ declare module 'vue' {
 export {}
 `;
 }
-function generatePwaImageType(filename, names) {
+function generatePwaImageType(filename, isNuxt4, names) {
   const propsName = `${filename}Props`;
+  if (isNuxt4) {
+    return `// Generated by @vite-pwa/nuxt
+export interface ${propsName} {
+  image: ${generateTypes(names)}
+  alt?: string
+  width?: number
+  height?: number
+  crossorigin?: '' | 'anonymous' | 'use-credentials'
+  loading?: 'lazy' | 'eager'
+  decoding?: 'async' | 'auto' | 'sync'
+  nonce?: string
+}
+`;
+  }
   return `// Generated by @vite-pwa/nuxt
 export interface ${propsName} {
   image: ${generateTypes(names)}
@@ -294,18 +309,19 @@ export default defineNuxtPlugin(() => {
   }
 }
 
-async function registerPwaIconsTypes(options, nuxt, resolver, runtimeDir) {
-  const pwaAssets = options.pwaAssets && !options.pwaAssets.disabled && (options.pwaAssets.config === true || !!options.pwaAssets.preset);
+async function registerPwaIconsTypes(ctx, runtimeDir) {
+  const { options, nuxt, resolver } = ctx;
+  const pwaAssets = options.pwaAssets && !options.pwaAssets.disabled;
   let dts;
   if (pwaAssets) {
     try {
       const { preparePWAIconTypes } = await import('../chunks/pwa-icons.mjs');
-      dts = await preparePWAIconTypes(options, nuxt);
+      dts = await preparePWAIconTypes(ctx);
     } catch {
       dts = void 0;
     }
   }
-  nuxt.options.alias["#pwa"] = resolver.resolve(runtimeDir, "composables/index.js");
+  nuxt.options.alias["#pwa"] = resolver.resolve(runtimeDir, "composables/index");
   nuxt.options.build.transpile.push("#pwa");
   addImports([
     "usePWA",
@@ -319,25 +335,35 @@ async function registerPwaIconsTypes(options, nuxt, resolver, runtimeDir) {
     as: key,
     from: resolver.resolve(runtimeDir, "composables/index")
   })));
+  const templates = [];
+  const isNuxt4 = ctx.nuxt4;
   const dtsContent = dts?.dts;
   if (dtsContent) {
-    addTypeTemplate({
+    templates.push(addTypeTemplate({
       write: true,
       filename: "pwa-icons/pwa-icons.d.ts",
       getContents: () => dtsContent
-    });
+    }).dst);
   } else {
-    addTypeTemplate({
+    templates.push(addTypeTemplate({
       write: true,
       filename: "pwa-icons/pwa-icons.d.ts",
       getContents: () => pwaIcons()
+    }).dst);
+  }
+  templates.push(addPwaTypeTemplate("PwaTransparentImage", isNuxt4, dts?.transparent));
+  templates.push(addPwaTypeTemplate("PwaMaskableImage", isNuxt4, dts?.maskable));
+  templates.push(addPwaTypeTemplate("PwaFaviconImage", isNuxt4, dts?.favicon));
+  templates.push(addPwaTypeTemplate("PwaAppleImage", isNuxt4, dts?.apple));
+  templates.push(addPwaTypeTemplate("PwaAppleSplashScreenImage", isNuxt4, dts?.appleSplashScreen));
+  if (ctx.nuxt4) {
+    ctx.nuxt.hook("prepare:types", (context) => {
+      const nodeReferences = context.nodeReferences;
+      for (const path of templates) {
+        nodeReferences.push({ path });
+      }
     });
   }
-  addPwaTypeTemplate("PwaTransparentImage", dts?.transparent);
-  addPwaTypeTemplate("PwaMaskableImage", dts?.maskable);
-  addPwaTypeTemplate("PwaFaviconImage", dts?.favicon);
-  addPwaTypeTemplate("PwaAppleImage", dts?.apple);
-  addPwaTypeTemplate("PwaAppleSplashScreenImage", dts?.appleSplashScreen);
   return !!dts;
 }
 
@@ -366,6 +392,19 @@ async function doSetup(options, nuxt) {
   const resolver = createResolver(import.meta.url);
   const nuxtVersion = getNuxtVersion(nuxt).split(".").map((v) => Number.parseInt(v));
   const nuxt3_8 = nuxtVersion.length > 1 && (nuxtVersion[0] > 3 || nuxtVersion[0] === 3 && nuxtVersion[1] >= 8);
+  const nuxt4 = nuxtVersion.length > 1 && nuxtVersion[0] >= 4;
+  const future = nuxt.options.future;
+  const ctx = {
+    nuxt,
+    nuxt3_8,
+    nuxt4,
+    // included at v3.12.0, then removed and included back again for v5 compatibility: we only need the layout to configure correctly the pwa assets image
+    // https://github.com/nuxt/nuxt/releases/tag/v3.12.0
+    nuxt4Compat: nuxt4 ? true : "compatibilityVersion" in future && typeof future.compatibilityVersion === "number" && future.compatibilityVersion >= 4,
+    resolver: createResolver(import.meta.url),
+    options,
+    publicDirFolder: resolveAlias("public")
+  };
   let vitePwaClientPlugin;
   const resolveVitePluginPWAAPI = () => {
     return vitePwaClientPlugin?.api;
@@ -376,8 +415,7 @@ async function doSetup(options, nuxt) {
     periodicSyncForUpdates: 0
   };
   const runtimeDir = resolver.resolve("../runtime");
-  if (!nuxt.options.ssr)
-    nuxt.options.build.transpile.push(runtimeDir);
+  nuxt.options.build.transpile.push(runtimeDir);
   if (client.registerPlugin) {
     addPlugin({
       src: resolver.resolve(runtimeDir, "plugins/pwa.client"),
@@ -386,40 +424,77 @@ async function doSetup(options, nuxt) {
   }
   const pwaAssetsEnabled = !!options.pwaAssets && options.pwaAssets.disabled !== true;
   addPWAIconsPluginTemplate(pwaAssetsEnabled);
-  await Promise.all([
-    addComponent({
-      name: "VitePwaManifest",
-      filePath: resolver.resolve(runtimeDir, "components/VitePwaManifest")
-    }),
-    addComponent({
-      name: "NuxtPwaManifest",
-      filePath: resolver.resolve(runtimeDir, "components/VitePwaManifest")
-    }),
-    addComponent({
-      name: "NuxtPwaAssets",
-      filePath: resolver.resolve(runtimeDir, "components/NuxtPwaAssets")
-    }),
-    addComponent({
-      name: "PwaAppleImage",
-      filePath: resolver.resolve(runtimeDir, "components/PwaAppleImage.vue")
-    }),
-    addComponent({
-      name: "PwaAppleSplashScreenImage",
-      filePath: resolver.resolve(runtimeDir, "components/PwaAppleSplashScreenImage.vue")
-    }),
-    addComponent({
-      name: "PwaFaviconImage",
-      filePath: resolver.resolve(runtimeDir, "components/PwaFaviconImage.vue")
-    }),
-    addComponent({
-      name: "PwaMaskableImage",
-      filePath: resolver.resolve(runtimeDir, "components/PwaMaskableImage.vue")
-    }),
-    addComponent({
-      name: "PwaTransparentImage",
-      filePath: resolver.resolve(runtimeDir, "components/PwaTransparentImage.vue")
-    })
-  ]);
+  if (ctx.nuxt4) {
+    await Promise.all([
+      addComponent({
+        name: "VitePwaManifest",
+        filePath: resolver.resolve(runtimeDir, "components/VitePwaManifest")
+      }),
+      addComponent({
+        name: "NuxtPwaManifest",
+        filePath: resolver.resolve(runtimeDir, "components/VitePwaManifest")
+      }),
+      addComponent({
+        name: "NuxtPwaAssets",
+        filePath: resolver.resolve(runtimeDir, "components/NuxtPwaAssets")
+      }),
+      addComponent({
+        name: "PwaAppleImage",
+        filePath: resolver.resolve(runtimeDir, "components/nuxt4/PwaAppleImage")
+      }),
+      addComponent({
+        name: "PwaAppleSplashScreenImage",
+        filePath: resolver.resolve(runtimeDir, "components/nuxt4/PwaAppleSplashScreenImage")
+      }),
+      addComponent({
+        name: "PwaFaviconImage",
+        filePath: resolver.resolve(runtimeDir, "components/nuxt4/PwaFaviconImage")
+      }),
+      addComponent({
+        name: "PwaMaskableImage",
+        filePath: resolver.resolve(runtimeDir, "components/nuxt4/PwaMaskableImage")
+      }),
+      addComponent({
+        name: "PwaTransparentImage",
+        filePath: resolver.resolve(runtimeDir, "components/nuxt4/PwaTransparentImage")
+      })
+    ]);
+  } else {
+    await Promise.all([
+      addComponent({
+        name: "VitePwaManifest",
+        filePath: resolver.resolve(runtimeDir, "components/VitePwaManifest")
+      }),
+      addComponent({
+        name: "NuxtPwaManifest",
+        filePath: resolver.resolve(runtimeDir, "components/VitePwaManifest")
+      }),
+      addComponent({
+        name: "NuxtPwaAssets",
+        filePath: resolver.resolve(runtimeDir, "components/NuxtPwaAssets")
+      }),
+      addComponent({
+        name: "PwaAppleImage",
+        filePath: resolver.resolve(runtimeDir, "components/PwaAppleImage.vue")
+      }),
+      addComponent({
+        name: "PwaAppleSplashScreenImage",
+        filePath: resolver.resolve(runtimeDir, "components/PwaAppleSplashScreenImage.vue")
+      }),
+      addComponent({
+        name: "PwaFaviconImage",
+        filePath: resolver.resolve(runtimeDir, "components/PwaFaviconImage.vue")
+      }),
+      addComponent({
+        name: "PwaMaskableImage",
+        filePath: resolver.resolve(runtimeDir, "components/PwaMaskableImage.vue")
+      }),
+      addComponent({
+        name: "PwaTransparentImage",
+        filePath: resolver.resolve(runtimeDir, "components/PwaTransparentImage.vue")
+      })
+    ]);
+  }
   nuxt.hook("prepare:types", ({ references }) => {
     references.push({ path: resolver.resolve(runtimeDir, "plugins/types") });
     references.push({ types: "@vite-pwa/nuxt/configuration" });
@@ -427,7 +502,7 @@ async function doSetup(options, nuxt) {
     references.push({ types: "vite-plugin-pwa/info" });
     references.push({ types: "vite-plugin-pwa/pwa-assets" });
   });
-  const pwaAssets = await registerPwaIconsTypes(options, nuxt, resolver, runtimeDir);
+  const pwaAssets = await registerPwaIconsTypes(ctx, runtimeDir);
   const manifestDir = join(nuxt.options.buildDir, "manifests");
   nuxt.options.nitro.publicAssets = nuxt.options.nitro.publicAssets || [];
   nuxt.options.nitro.publicAssets.push({
@@ -435,7 +510,7 @@ async function doSetup(options, nuxt) {
     maxAge: 0
   });
   nuxt.hook("nitro:init", (nitro) => {
-    configurePWAOptions(nuxt3_8, options, nuxt, nitro.options);
+    configurePWAOptions(ctx, nitro.options);
   });
   nuxt.hook("vite:extend", ({ config }) => {
     const plugin = config.plugins?.find((p) => p && typeof p === "object" && "name" in p && p.name === "vite-plugin-pwa");

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@vite-pwa/nuxt",
   "type": "module",
-  "version": "1.0.6",
+  "version": "1.0.7",
   "description": "Zero-config PWA for Nuxt 3",
   "author": "antfu <anthonyfu117@hotmail.com>",
   "license": "MIT",
@@ -98,6 +98,10 @@
     "dev:prepare": "nuxt-module-build build --stub && nuxt-module-build prepare && nuxi prepare playground",
     "dev:preview:build": "nr dev:build && node playground/.output/server/index.mjs",
     "dev:preview:generate": "nr dev:generate && serve playground/dist",
+    "dev:assets:prepare": "nuxt-module-build build --stub && nuxt-module-build prepare && nuxi prepare playground-assets",
+    "dev:assets": "nr dev:assets:prepare && nuxi dev playground-assets",
+    "dev:assets:generate": "nr dev:assets:prepare && nuxi generate playground-assets",
+    "dev:assets:build": "nr dev:assets:prepare && nuxi build playground-assets",
     "release": "bumpp",
     "lint": "eslint .",
     "lint:fix": "nr lint --fix",