@serwist/vite 8.2.0 → 8.3.0

package/dist/index.js

@@ -1,5 +1,7 @@
-import { m as mainPlugin, d as devPlugin, c as createContext, a as createApi } from './main-dzWmj8BB.js';
+import { m as mainPlugin, d as devPlugin, c as createContext, a as createApi } from './main.js';
+import 'node:fs/promises';
 import 'node:path';
+import 'vite';
 import 'node:process';
 import 'node:crypto';
 import 'node:fs';
@@ -35,7 +37,7 @@ const buildPlugin = (ctx, api)=>{
     return [
         mainPlugin(ctx, api),
         buildPlugin(ctx, api),
-        devPlugin(ctx)
+        devPlugin(ctx, api)
     ];
 };
 

package/dist/integration/svelte/index.js

@@ -1,15 +1,29 @@
-import { l as loadSerwistBuild, m as mainPlugin, d as devPlugin, c as createContext, a as createApi } from '../../main-dzWmj8BB.js';
+import { r as resolveEntry, l as loadSerwistBuild, m as mainPlugin, d as devPlugin, c as createContext, a as createApi } from '../../main.js';
+import crypto from 'node:crypto';
+import os from 'node:os';
 import path from 'node:path';
+import { errors } from '@serwist/build';
+import 'node:fs/promises';
+import 'vite';
 import 'node:process';
-import 'node:crypto';
 import 'node:fs';
 import 'fast-glob';
 
 const configurateSvelteKitOptions = (viteConfig, kit, options)=>{
     const clientOutDir = path.resolve(viteConfig.root, viteConfig.build.outDir, "../client");
     // Kit fixes the service worker's name to 'service-worker.js'
-    options.swSrc = path.resolve(clientOutDir, "service-worker.js");
-    options.swDest = path.resolve(clientOutDir, "service-worker.js");
+    if (viteConfig.isProduction) {
+        options.swSrc = path.resolve(clientOutDir, "service-worker.js");
+        options.swDest = path.resolve(clientOutDir, "service-worker.js");
+    } else {
+        const swSrc = resolveEntry(path.join(viteConfig.root, kit.files?.serviceWorker ?? "src/service-worker"));
+        if (swSrc) {
+            options.swSrc = swSrc;
+            options.swDest = path.join(os.tmpdir(), `serwist-vite-integration-svelte-${crypto.randomUUID()}.js`);
+        } else {
+            throw new Error(errors["invalid-sw-src"]);
+        }
+    }
     options.swUrl = "/service-worker.js";
     // SvelteKit's outDir is `.svelte-kit/output/client`.
     // We need to include the parent folder in globDirectory since SvelteKit will generate SSG in `.svelte-kit/output/prerendered` folder.
@@ -36,6 +50,9 @@ const configurateSvelteKitOptions = (viteConfig, kit, options)=>{
     if (!("dontCacheBustURLsMatching" in options)) {
         options.dontCacheBustURLsMatching = new RegExp(`${buildAssetsDir}immutable/`);
     }
+    if (!options.injectionPoint) {
+        options.injectionPoint = "self.__SW_MANIFEST";
+    }
 };
 function createManifestTransform(base, webManifestName, options) {
     return async (entries)=>{
@@ -119,7 +136,7 @@ const serwistSveltePlugin = (ctx, api)=>{
                 if (api && !api.disabled && ctx.viteConfig.build.ssr) {
                     const [injectManifest, logSerwistResult] = await Promise.all([
                         loadSerwistBuild().then((m)=>m.injectManifest),
-                        import('../../log-Dyh-Moyt.js').then((m)=>m.logSerwistResult)
+                        import('../../log.js').then((m)=>m.logSerwistResult)
                     ]);
                     // Inject the manifest
                     const buildResult = await injectManifest(ctx.options.injectManifest);
@@ -143,7 +160,7 @@ const serwistSveltePlugin = (ctx, api)=>{
     const api = createApi(ctx);
     return [
         mainPlugin(ctx, api),
-        devPlugin(ctx),
+        devPlugin(ctx, api),
         serwistSveltePlugin(ctx, api)
     ];
 };

package/dist/integration/svelte/types.d.ts

@@ -1,7 +1,7 @@
 import type { KitConfig } from "@sveltejs/kit";
 import type { PluginOptions as BasePluginOptions } from "../../types.js";
 import type { Optional } from "../../utils-types.js";
-export interface KitOptions extends Pick<KitConfig, "appDir"> {
+export interface KitOptions extends Pick<KitConfig, "appDir" | "files"> {
     /**
      * @see https://kit.svelte.dev/docs/adapter-static#options-fallback
      */

package/dist/{log-Dyh-Moyt.js → log.js}

@@ -1,5 +1,7 @@
-import { b as cyan, v as version, g as green, e as dim, y as yellow } from './main-dzWmj8BB.js';
+import { b as cyan, v as version, g as green, e as dim, y as yellow } from './main.js';
+import 'node:fs/promises';
 import 'node:path';
+import 'vite';
 import 'node:process';
 import 'node:crypto';
 import 'node:fs';

package/dist/{main-dzWmj8BB.js → main.js}

@@ -1,7 +1,9 @@
+import fs from 'node:fs/promises';
 import path, { resolve } from 'node:path';
+import { normalizePath } from 'vite';
 import process$1 from 'node:process';
 import crypto from 'node:crypto';
-import fs from 'node:fs';
+import fs$1 from 'node:fs';
 import fg from 'fast-glob';
 
 let enabled = true;
@@ -64,7 +66,7 @@ const green = kolorist(32, 39);
 const yellow = kolorist(33, 39);
 const cyan = kolorist(36, 39);
 
-var version = "8.2.0";
+var version = "8.3.0";
 
 const logSerwistResult = (buildResult, viteOptions)=>{
     const { logLevel = "info" } = viteOptions;
@@ -108,34 +110,40 @@ const generateInjectManifest = async (options, viteOptions)=>{
     define["process.env.NODE_ENV"] = JSON.stringify(options.mode);
     const { format, plugins, rollupOptions } = options.injectManifestRollupOptions;
     const parsedSwDest = path.parse(options.injectManifest.swDest);
-    await build({
-        root: viteOptions.root,
-        base: viteOptions.base,
-        resolve: viteOptions.resolve,
-        // Don't copy anything from public folder
-        publicDir: false,
-        build: {
-            sourcemap: viteOptions.build.sourcemap,
-            lib: {
-                entry: options.injectManifest.swSrc,
-                name: "app",
-                formats: [
-                    format
-                ]
+    if (viteOptions.isProduction || options.devOptions.bundle) {
+        await build({
+            logLevel: viteOptions.isProduction ? "info" : "warn",
+            root: viteOptions.root,
+            base: viteOptions.base,
+            resolve: viteOptions.resolve,
+            // Don't copy anything from public folder
+            publicDir: false,
+            build: {
+                sourcemap: viteOptions.build.sourcemap,
+                lib: {
+                    entry: options.injectManifest.swSrc,
+                    name: "app",
+                    formats: [
+                        format
+                    ]
+                },
+                rollupOptions: {
+                    ...rollupOptions,
+                    plugins,
+                    output: {
+                        entryFileNames: parsedSwDest.base
+                    }
+                },
+                outDir: parsedSwDest.dir,
+                emptyOutDir: false,
+                minify: viteOptions.isProduction
             },
-            rollupOptions: {
-                ...rollupOptions,
-                plugins,
-                output: {
-                    entryFileNames: parsedSwDest.base
-                }
-            },
-            outDir: parsedSwDest.dir,
-            emptyOutDir: false
-        },
-        configFile: false,
-        define
-    });
+            configFile: false,
+            define
+        });
+    } else {
+        await fs.copyFile(options.injectManifest.swSrc, options.injectManifest.swDest);
+    }
     // If the user doesn't have an injectionPoint, skip injectManifest.
     if (!options.injectManifest.injectionPoint) return;
     await options.integration?.beforeBuildServiceWorker?.(options);
@@ -146,9 +154,7 @@ const generateInjectManifest = async (options, viteOptions)=>{
     };
     const { injectManifest } = await loadSerwistBuild();
     // Inject the manifest
-    const buildResult = await injectManifest(resolvedInjectManifestOptions);
-    // Log workbox result
-    logSerwistResult(buildResult, viteOptions);
+    return await injectManifest(resolvedInjectManifestOptions);
 };
 
 const createApi = (ctx)=>{
@@ -160,7 +166,19 @@ const createApi = (ctx)=>{
             if (ctx.options.disable) {
                 return undefined;
             }
-            return await generateInjectManifest(ctx.options, ctx.viteConfig);
+            const buildResult = await generateInjectManifest(ctx.options, ctx.viteConfig);
+            if (buildResult) {
+                if (ctx.viteConfig.isProduction) {
+                    // Log Serwist result
+                    logSerwistResult(buildResult, ctx.viteConfig);
+                } else if (buildResult.warnings && buildResult.warnings.length > 0) {
+                    console.warn(yellow([
+                        "[@serwist/vite] Warnings",
+                        ...buildResult.warnings.map((w)=>` - ${w}`),
+                        ""
+                    ].join("\n")));
+                }
+            }
         },
         extendManifestEntries (fn) {
             const { options } = ctx;
@@ -183,12 +201,86 @@ const createContext = (userOptions)=>{
     };
 };
 
-const devPlugin = (ctx)=>{
+const slash = (str)=>{
+    return str.replace(/\\/g, "/");
+};
+const resolveBasePath = (base)=>{
+    if (isAbsolute(base)) return base;
+    return !base.startsWith("/") && !base.startsWith("./") ? `/${base}` : base;
+};
+const isAbsolute = (url)=>{
+    return url.match(/^(?:[a-z]+:)?\/\//i);
+};
+// Source: https://github.com/sveltejs/kit/blob/6419d3eaa7bf1b0a756b28f06a73f71fe042de0a/packages/kit/src/utils/filesystem.js
+// License: MIT
+const resolveEntry = (entry)=>{
+    if (fs$1.existsSync(entry)) {
+        const stats = fs$1.statSync(entry);
+        if (stats.isDirectory()) {
+            return resolveEntry(path.join(entry, "index"));
+        }
+        return entry;
+    } else {
+        const dir = path.dirname(entry);
+        if (fs$1.existsSync(dir)) {
+            const base = path.basename(entry);
+            const files = fs$1.readdirSync(dir);
+            const found = files.find((file)=>file.replace(/\.[^.]+$/, "") === base);
+            if (found) return path.join(dir, found);
+        }
+    }
+    return null;
+};
+// Source: https://github.com/sveltejs/kit/blob/6419d3eaa7bf1b0a756b28f06a73f71fe042de0a/packages/kit/src/utils/filesystem.js
+// License: MIT
+function toFs(str) {
+    str = str.replace(/\\/g, "/");
+    // Windows/Linux separation - Windows starts with a drive letter, we need a / in front there
+    return `/@fs${str.startsWith("/") ? "" : "/"}${str}`;
+}
+
+// This plugin handles the service worker in two ways:
+// - If `devOptions.bundle` is enabled, hook a middleware that bundles the service worker
+// through `api.generateSW()` and returns the result into Vite's dev server.
+// - Otherwise, run `injectManifest` and return the service worker through `async load(id)`. Although
+// `precacheEntries` is always `undefined`, we still do this to check the user's `injectManifest` options
+// in dev mode.
+const devPlugin = (ctx, api)=>{
     return {
         name: "@serwist/vite:dev",
         apply: "serve",
-        configureServer () {
+        configureServer (server) {
             ctx.devEnvironment = true;
+            server.middlewares.use(async (req, res, next)=>{
+                if (!ctx.options.disable && req.url === ctx.options.swUrl) {
+                    if (ctx.options.devOptions.bundle) {
+                        await api.generateSW();
+                        const content = await fs.readFile(ctx.options.injectManifest.swDest, "utf-8");
+                        await fs.rm(ctx.options.injectManifest.swDest);
+                        res.setHeader("Content-Type", "application/javascript");
+                        res.write(content);
+                        res.end();
+                    } else {
+                        res.setHeader("Content-Type", "application/javascript");
+                        res.write(`import "${toFs(path.resolve(ctx.options.injectManifest.swSrc))}";`);
+                        res.end();
+                    }
+                } else {
+                    next();
+                }
+            });
+        },
+        async load (id) {
+            if (!ctx.options.disable && !ctx.options.devOptions.bundle) {
+                const swSrcId = normalizePath(ctx.options.injectManifest.swSrc);
+                if (id === swSrcId) {
+                    await api.generateSW();
+                    const content = await fs.readFile(ctx.options.injectManifest.swDest, "utf-8");
+                    await fs.rm(ctx.options.injectManifest.swDest);
+                    return content;
+                }
+            }
+            return undefined;
         }
     };
 };
@@ -199,7 +291,7 @@ const RESOLVED_INTERNAL_SERWIST_VIRTUAL = `\0${INTERNAL_SERWIST_VIRTUAL}`;
 const buildManifestEntry = (publicDir, url)=>{
     return new Promise((resolve$1, reject)=>{
         const cHash = crypto.createHash("MD5");
-        const stream = fs.createReadStream(resolve(publicDir, url));
+        const stream = fs$1.createReadStream(resolve(publicDir, url));
         stream.on("error", (err)=>{
             reject(err);
         });
@@ -257,24 +349,17 @@ const configureStaticAssets = async (resolvedPluginOptions, viteConfig)=>{
     }
 };
 
-const slash = (str)=>{
-    return str.replace(/\\/g, "/");
-};
-const resolveBasePath = (base)=>{
-    if (isAbsolute(base)) return base;
-    return !base.startsWith("/") && !base.startsWith("./") ? `/${base}` : base;
-};
-const isAbsolute = (url)=>{
-    return url.match(/^(?:[a-z]+:)?\/\//i);
-};
-
 const resolveOptions = async (options, viteConfig)=>{
-    const { type = "classic", mode = process$1.env.NODE_ENV || "production", injectRegister = "auto", registerType = "prompt", minify = true, base = viteConfig.base, includeAssets = undefined, useCredentials = false, disable = false, integration = {}, buildBase, ...injectManifest } = options;
+    const { type = "classic", mode = process$1.env.NODE_ENV || "production", injectRegister = "auto", registerType = "prompt", minify = true, base = viteConfig.base, includeAssets = undefined, useCredentials = false, disable = false, integration = {}, buildBase, devOptions, ...injectManifest } = options;
     const basePath = resolveBasePath(base);
     // check typescript service worker for injectManifest strategy
     const scope = options.scope || basePath;
     let assetsDir = slash(viteConfig.build.assetsDir ?? "assets");
     if (assetsDir[assetsDir.length - 1] !== "/") assetsDir += "/";
+    const resolvedDevOptions = {
+        bundle: true,
+        ...devOptions
+    };
     // remove './' prefix from assetsDir
     const dontCacheBustURLsMatching = new RegExp(`^${assetsDir.replace(/^\.*?\//, "")}`);
     const { plugins = [], rollupOptions = {}, rollupFormat = "es", swUrl = "/sw.js", swSrc, swDest, ...userInjectManifest } = injectManifest || {};
@@ -303,7 +388,8 @@ const resolveOptions = async (options, viteConfig)=>{
             plugins,
             rollupOptions,
             format: rollupFormat
-        }
+        },
+        devOptions: resolvedDevOptions
     };
     // calculate hash only when required
     const calculateHash = !resolvedPluginOptions.disable && resolvedPluginOptions.includeAssets && viteConfig.command === "build";
@@ -345,4 +431,4 @@ export const swType = "${ctx.devEnvironment ? "module" : ctx.options.type}";`;
     };
 };
 
-export { createApi as a, cyan as b, createContext as c, devPlugin as d, dim as e, green as g, loadSerwistBuild as l, mainPlugin as m, version as v, yellow as y };
+export { createApi as a, cyan as b, createContext as c, devPlugin as d, dim as e, green as g, loadSerwistBuild as l, mainPlugin as m, resolveEntry as r, version as v, yellow as y };

package/dist/modules.d.ts

@@ -2,4 +2,4 @@ import type * as SerwistBuild from "@serwist/build";
 import type { ResolvedConfig } from "vite";
 import type { ResolvedPluginOptions } from "./types.js";
 export declare const loadSerwistBuild: () => Promise<typeof SerwistBuild>;
-export declare const generateInjectManifest: (options: ResolvedPluginOptions, viteOptions: ResolvedConfig) => Promise<void>;
+export declare const generateInjectManifest: (options: ResolvedPluginOptions, viteOptions: ResolvedConfig) => Promise<SerwistBuild.BuildResult | undefined>;

package/dist/plugins/dev.d.ts

@@ -1,3 +1,4 @@
-import type { Plugin } from "vite";
+import { type Plugin } from "vite";
 import type { SerwistViteContext } from "../context.js";
-export declare const devPlugin: (ctx: SerwistViteContext) => Plugin;
+import type { SerwistViteApi } from "../types.js";
+export declare const devPlugin: (ctx: SerwistViteContext, api: SerwistViteApi) => Plugin;

package/dist/types.d.ts

@@ -34,6 +34,17 @@ export interface SerwistViteHooks {
     closeBundleOrder?: "pre" | "post" | null;
     configureOptions?: (viteOptions: ResolvedConfig, options: PluginOptions) => void | Promise<void>;
 }
+export interface DevOptions {
+    /**
+     * Whether the service worker should be bundled in development mode.
+     *
+     * [Many browsers still do not support ES Modules in service workers.](https://caniuse.com/mdn-api_serviceworker_ecmascript_modules) However, in development
+     * mode, certain frameworks, such as SvelteKit, do not bundle the service worker. As a result, trying to register that service worker on browsers lacking
+     * support, such as Firefox or Safari, will fail, but doing so on browsers not lacking support will not fail. This option is provided to prevent that from
+     * happening. What the plugin does is intercepting any request to the service worker (requests for `swUrl`) and returning a bundled one.
+     */
+    bundle?: boolean;
+}
 /**
  * Plugin options.
  */
@@ -135,7 +146,9 @@ export interface BasePluginOptions {
      */
     buildBase?: string;
 }
-export type PluginOptions = Partial<BasePluginOptions> & CustomInjectManifestOptions;
+export interface PluginOptions extends Partial<BasePluginOptions>, CustomInjectManifestOptions {
+    devOptions?: DevOptions;
+}
 export interface InjectManifestRollupOptions {
     format: "es" | "iife";
     plugins: Plugin[];
@@ -144,6 +157,7 @@ export interface InjectManifestRollupOptions {
 export interface ResolvedPluginOptions extends Required<BasePluginOptions>, Required<Pick<CustomInjectManifestOptions, "swUrl">> {
     injectManifest: InjectManifestOptions;
     injectManifestRollupOptions: InjectManifestRollupOptions;
+    devOptions: Required<DevOptions>;
 }
 export interface ShareTargetFiles {
     name: string;

package/dist/utils.d.ts

@@ -2,3 +2,5 @@ export declare const slash: (str: string) => string;
 export declare const resolveBasePath: (base: string) => string;
 export declare const isAbsolute: (url: string) => RegExpMatchArray | null;
 export declare const normalizePath: (path: string) => string;
+export declare const resolveEntry: (entry: string) => string | null;
+export declare function toFs(str: string): string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@serwist/vite",
-  "version": "8.2.0",
+  "version": "8.3.0",
   "type": "module",
   "description": "A module that integrates Serwist into your Vite application.",
   "files": [
@@ -77,8 +77,8 @@
     "debug": "4.3.4",
     "fast-glob": "3.3.2",
     "pretty-bytes": "6.1.1",
-    "@serwist/build": "8.2.0",
-    "@serwist/window": "8.2.0"
+    "@serwist/build": "8.3.0",
+    "@serwist/window": "8.3.0"
   },
   "devDependencies": {
     "@playwright/test": "1.40.1",
@@ -100,7 +100,7 @@
     "typescript": "5.4.0-dev.20231226",
     "vite": "5.0.10",
     "vue": "3.3.13",
-    "@serwist/constants": "8.2.0"
+    "@serwist/constants": "8.3.0"
   },
   "peerDependencies": {
     "@sveltejs/kit": "^1.0.0 || ^2.0.0",