vite-plugin-cross-origin-storage 1.8.0 → 2.0.1

package/dist/index.mjs

@@ -0,0 +1,242 @@
+import { createHash } from "node:crypto";
+import { existsSync } from "node:fs";
+import { fileURLToPath } from "node:url";
+import MagicString from "magic-string";
+import { rolldown } from "rolldown";
+import { parseAst } from "rolldown/parseAst";
+
+//#region src/index.ts
+const MANIFEST_PLACEHOLDER = "__COS_MANIFEST__";
+/**
+* Recipe version embedded in every content-addressed specifier. Bump this
+* whenever the build recipe (bundler version, options, define replacements)
+* changes in a way that alters emitted bytes, so chunks built under different
+* recipes cannot silently collide on the same SHA-256.
+*/
+const RECIPE = "cos1";
+function defaultLoaderEntry() {
+	for (const ext of ["mjs", "ts"]) {
+		const candidate = fileURLToPath(new URL(`./loader.entry.${ext}`, import.meta.url));
+		if (existsSync(candidate)) return candidate;
+	}
+	throw new Error("[cos] could not locate the runtime loader entry");
+}
+function contentSpecifier(hash) {
+	return `${RECIPE}:${hash}`;
+}
+function toMatchers(packages) {
+	return packages.map((p) => typeof p === "string" ? new RegExp(`^${p}$`) : p);
+}
+/**
+* Bundle the runtime loader into a self-contained IIFE with rolldown, leaving
+* `__COS_MANIFEST__` as a literal token for the caller to substitute. Bundling
+* from source keeps the loader correct regardless of how the host build loaded
+* this plugin.
+*/
+async function bundleLoader(entry) {
+	const builder = await rolldown({
+		input: entry,
+		platform: "browser",
+		treeshake: true
+	});
+	const { output } = await builder.generate({
+		format: "iife",
+		minify: true
+	});
+	await builder.close();
+	return output[0].code;
+}
+/** Collect every static and dynamic import/export source string literal. */
+function collectImportSources(code) {
+	const sources = [];
+	const visit = (node) => {
+		if (!node || typeof node !== "object") return;
+		if (Array.isArray(node)) {
+			for (const child of node) visit(child);
+			return;
+		}
+		const record = node;
+		if (record.type === "ImportDeclaration" || record.type === "ExportNamedDeclaration" || record.type === "ExportAllDeclaration" || record.type === "ImportExpression") {
+			const source = record.source;
+			if (source?.type === "Literal" && typeof source.value === "string" && typeof source.start === "number" && typeof source.end === "number") sources.push({
+				value: source.value,
+				start: source.start,
+				end: source.end
+			});
+		}
+		for (const key in record) if (key !== "type") visit(record[key]);
+	};
+	visit(parseAst(code));
+	return sources;
+}
+/**
+* Rewrite import/export specifiers by AST position rather than by pattern, so a
+* managed specifier appearing in an ordinary string literal is never touched
+* and dynamic imports are handled the same as static ones. Returns a sourcemap
+* only when `withMap` is set (i.e. the source chunk already had one to keep
+* valid); the standalone cos chunks have no downstream map and skip it.
+*/
+function rewriteSpecifiers(code, rewrites, fileName, withMap) {
+	const edits = collectImportSources(code).filter((s) => rewrites.has(s.value));
+	if (!edits.length) return { code };
+	const magic = new MagicString(code);
+	for (const { value, start, end } of edits) {
+		const quote = code[start];
+		magic.overwrite(start, end, `${quote}${rewrites.get(value)}${quote}`);
+	}
+	return {
+		code: magic.toString(),
+		map: withMap ? magic.generateMap({
+			source: fileName,
+			hires: "boundary"
+		}) : void 0
+	};
+}
+function joinBase(base, assetsDir) {
+	const prefix = base.endsWith("/") ? base : `${base}/`;
+	const dir = assetsDir.replace(/^\/+|\/+$/g, "");
+	return dir ? `${prefix}${dir}/` : prefix;
+}
+function cosPlugin(options) {
+	const packages = toMatchers(options.packages);
+	const loaderEntry = options.loaderEntry ?? defaultLoaderEntry();
+	const collected = /* @__PURE__ */ new Set();
+	let assetsDir = "assets";
+	let resolvedBase = "/";
+	let loaderTemplate;
+	let scriptContent = "";
+	return {
+		name: "vite-plugin-cos",
+		enforce: "pre",
+		apply: "build",
+		configResolved(config) {
+			assetsDir = config.build.assetsDir;
+			resolvedBase = config.base;
+		},
+		resolveId: {
+			order: "pre",
+			filter: { id: packages },
+			async handler(id, importer, resolveOptions) {
+				const resolved = await this.resolve(id, importer, {
+					...resolveOptions,
+					skipSelf: true
+				});
+				if (!resolved) return;
+				collected.add(resolved.id);
+				return {
+					id: `cos-ext:${resolved.id}`,
+					external: true
+				};
+			}
+		},
+		async generateBundle(_outputOptions, bundle) {
+			if (!collected.size) return;
+			const base = options.base ?? joinBase(resolvedBase, assetsDir);
+			const assetPrefix = assetsDir ? `${assetsDir.replace(/^\/+|\/+$/g, "")}/` : "";
+			const raw = /* @__PURE__ */ new Map();
+			const queue = [...collected];
+			while (queue.length) {
+				const input = queue.shift();
+				if (raw.has(input)) continue;
+				const deps = /* @__PURE__ */ new Set();
+				let code;
+				try {
+					const builder = await rolldown({
+						input,
+						platform: "browser",
+						treeshake: false,
+						plugins: [{
+							name: "cos-externalise-deps",
+							async resolveId(id, importer) {
+								if (!importer) return null;
+								const dep = await this.resolve(id, importer, { skipSelf: true });
+								if (!dep) return null;
+								deps.add(dep.id);
+								return {
+									id: `cos-dep:${dep.id}`,
+									external: true
+								};
+							}
+						}]
+					});
+					const { output } = await builder.generate({
+						file: "chunk.js",
+						codeSplitting: false,
+						minify: true
+					});
+					await builder.close();
+					code = output[0].code;
+				} catch (error) {
+					throw new Error(`[cos] cannot bundle managed package as a standalone chunk:\n  ${input}\nIt likely imports build-time virtuals (e.g. \`#build/*\`, \`#imports\`) that only resolve inside the host build, so it is not a self-contained, shareable artifact. Only depend on packages whose source resolves from disk on its own.\n\nUnderlying error: ${error.message}`, { cause: error });
+				}
+				raw.set(input, {
+					code,
+					deps: [...deps]
+				});
+				queue.push(...deps);
+			}
+			const hashes = /* @__PURE__ */ new Map();
+			const managed = {};
+			const visit = (id, stack) => {
+				const existing = hashes.get(id);
+				if (existing) return existing;
+				if (stack.includes(id)) throw new Error(`[cos] dependency cycle between managed packages: ${[...stack, id].join(" -> ")}`);
+				const { code, deps } = raw.get(id);
+				const rewrites = /* @__PURE__ */ new Map();
+				for (const dep of deps) rewrites.set(`cos-dep:${dep}`, contentSpecifier(visit(dep, [...stack, id])));
+				const { code: resolved } = rewriteSpecifiers(code, rewrites, "", false);
+				const hash = createHash("sha256").update(resolved).digest("hex");
+				const fileName = `${assetPrefix}${hash}.js`;
+				hashes.set(id, hash);
+				managed[contentSpecifier(hash)] = {
+					file: `${hash}.js`,
+					hash
+				};
+				bundle[fileName] = {
+					type: "asset",
+					fileName,
+					name: hash,
+					names: [hash],
+					originalFileName: null,
+					originalFileNames: [],
+					needsCodeReference: false,
+					source: resolved
+				};
+				return hash;
+			};
+			for (const id of raw.keys()) visit(id, []);
+			const appRewrites = /* @__PURE__ */ new Map();
+			for (const id of collected) appRewrites.set(`cos-ext:${id}`, contentSpecifier(hashes.get(id)));
+			let entry;
+			for (const file of Object.values(bundle)) {
+				if (file.type !== "chunk") continue;
+				const { code, map } = rewriteSpecifiers(file.code, appRewrites, file.fileName, !!file.map);
+				file.code = code;
+				if (map) file.map = map;
+				if (file.isEntry) entry = {
+					specifier: `${RECIPE}:entry`,
+					file: file.fileName.replace(new RegExp(`^${assetPrefix}`), "")
+				};
+			}
+			if (!entry) return;
+			const manifest = {
+				base,
+				entry,
+				chunks: managed
+			};
+			loaderTemplate ??= bundleLoader(loaderEntry);
+			scriptContent = (await loaderTemplate).replace(MANIFEST_PLACEHOLDER, JSON.stringify(manifest));
+			options.onGenerated?.(scriptContent);
+		},
+		transformIndexHtml: {
+			order: "post",
+			handler(html) {
+				if (options.onGenerated || !scriptContent) return html;
+				return html.replace(/<script type="module"[^>]*src="[^"]*"[^>]*><\/script>/g, "").replace("</head>", `<script id="cos-loader">${scriptContent}<\/script></head>`);
+			}
+		}
+	};
+}
+
+//#endregion
+export { cosPlugin, cosPlugin as default };

package/dist/loader.d.mts

@@ -0,0 +1,38 @@
+//#region src/loader.d.ts
+declare global {
+  interface Navigator {
+    crossOriginStorage?: {
+      requestFileHandles: (descriptors: Array<{
+        algorithm: string;
+        value: string;
+      }>, options?: {
+        create?: boolean;
+      }) => Promise<Array<{
+        getFile: () => Promise<File>;
+        createWritable: () => Promise<{
+          write: (data: Blob) => Promise<void>;
+          close: () => Promise<void>;
+        }>;
+      }>>;
+    };
+  }
+}
+interface CosManifest {
+  /** Public base path that managed chunks are served from, e.g. `/_nuxt/`. */
+  base: string;
+  /**
+   * The entry chunk to import once the import map is ready. It is app-specific, so it is
+   * loaded straight from the network rather than stored in COS by a content hash.
+   */
+  entry: {
+    specifier: string;
+    file: string;
+  };
+  /** Map of content-addressed specifier to `{ file, hash }` for every COS-managed chunk. */
+  chunks: Record<string, {
+    file: string;
+    hash: string;
+  }>;
+}
+//#endregion
+export { CosManifest };

package/dist/loader.entry.d.mts

@@ -0,0 +1 @@
+export { };

package/dist/loader.entry.mjs

@@ -0,0 +1,7 @@
+import { runCosLoader } from "./loader.mjs";
+
+//#region src/loader.entry.ts
+runCosLoader(__COS_MANIFEST__);
+
+//#endregion
+export {  };

package/dist/loader.mjs

@@ -0,0 +1,51 @@
+//#region src/loader.ts
+async function runCosLoader(manifest) {
+	const cos = navigator.crossOriginStorage;
+	const imports = {};
+	async function resolveChunk(hash, file) {
+		if (cos) try {
+			const [handle] = await cos.requestFileHandles([{
+				algorithm: "SHA-256",
+				value: hash
+			}]);
+			if (handle) {
+				const blob = await handle.getFile();
+				return URL.createObjectURL(new Blob([blob], { type: "text/javascript" }));
+			}
+		} catch (error) {
+			if (error?.name !== "NotFoundError") console.error("[cos] lookup failed", error);
+		}
+		const response = await fetch(file);
+		const blob = new Blob([await response.blob()], { type: "text/javascript" });
+		if (cos) try {
+			const [handle] = await cos.requestFileHandles([{
+				algorithm: "SHA-256",
+				value: hash
+			}], { create: true });
+			if (handle) {
+				const writable = await handle.createWritable();
+				await writable.write(blob);
+				await writable.close();
+			}
+		} catch (error) {
+			console.error("[cos] store failed", error);
+		}
+		return URL.createObjectURL(blob);
+	}
+	await Promise.all(Object.entries(manifest.chunks).map(async ([specifier, { file, hash }]) => {
+		imports[specifier] = await resolveChunk(hash, manifest.base + file);
+	}));
+	imports[manifest.entry.specifier] = new URL(manifest.base + manifest.entry.file, location.origin).href;
+	const script = document.createElement("script");
+	script.type = "importmap";
+	script.textContent = JSON.stringify({ imports });
+	document.head.appendChild(script);
+	await new Promise((resolve) => setTimeout(resolve, 0));
+	await import(
+		/* @vite-ignore */
+		manifest.entry.specifier
+);
+}
+
+//#endregion
+export { runCosLoader };

package/package.json

@@ -1,70 +1,72 @@
 {
   "name": "vite-plugin-cross-origin-storage",
-  "version": "1.8.0",
-  "description": "Vite plugin to load chunks from Cross-Origin Storage",
+  "type": "module",
+  "version": "2.0.1",
+  "description": "Vite plugin to extract shared dependencies into content-addressed chunks loaded from Cross-Origin Storage",
+  "author": {
+    "name": "Daniel Roe",
+    "email": "daniel@roe.dev",
+    "url": "https://github.com/danielroe"
+  },
+  "contributors": [
+    {
+      "name": "Thomas Steiner",
+      "url": "https://github.com/tomayac"
+    }
+  ],
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/danielroe/cross-origin-storage.git",
+    "directory": "packages/vite-plugin-cross-origin-storage"
+  },
   "keywords": [
-    "vite",
-    "plugin",
+    "vite-plugin",
     "cross-origin-storage",
     "cos",
-    "loader",
+    "content-addressed",
     "performance"
   ],
-  "author": "Thomas Steiner",
-  "license": "Apache-2.0",
-  "homepage": "https://github.com/tomayac/vite-plugin-cross-origin-storage#readme",
-  "repository": {
-    "type": "git",
-    "url": "git+https://github.com/tomayac/vite-plugin-cross-origin-storage.git"
-  },
-  "bugs": {
-    "url": "https://github.com/tomayac/vite-plugin-cross-origin-storage/issues"
-  },
-  "type": "module",
-  "main": "./dist/index.js",
-  "module": "./dist/index.js",
-  "types": "./dist/index.d.ts",
+  "sideEffects": false,
   "exports": {
     ".": {
-      "types": "./dist/index.d.ts",
-      "import": "./dist/index.js"
+      "import": "./dist/index.mjs"
     }
   },
+  "main": "./dist/index.mjs",
+  "module": "./dist/index.mjs",
+  "types": "./dist/index.d.mts",
   "files": [
-    "dist",
-    "loader.js"
+    "dist"
   ],
-  "scripts": {
-    "build": "tsup index.ts --format esm --dts --clean && cp loader.js dist/",
-    "prepublishOnly": "npm run build",
-    "test:simple:dev": "npm run build && vite testing/simple-test",
-    "test:simple:build": "npm run build && vite build testing/simple-test",
-    "test:simple:preview": "vite preview testing/simple-test",
-    "test:react-hello-world:dev": "npm run build && vite testing/react-hello-world",
-    "test:react-hello-world:build": "npm run build && vite build testing/react-hello-world",
-    "test:react-hello-world:preview": "vite preview testing/react-hello-world",
-    "test:react-todo:dev": "npm run build && vite testing/react-todo",
-    "test:react-todo:build": "npm run build && vite build testing/react-todo",
-    "test:react-todo:preview": "vite preview --port 4174 testing/react-todo"
+  "engines": {
+    "node": ">=20.19.0"
   },
   "peerDependencies": {
-    "vite": "^4.0.0 || ^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0"
+    "vite": "^5.0.0 || ^6.0.0 || ^7.0.0"
+  },
+  "dependencies": {
+    "magic-string": "^0.30.21",
+    "rolldown": "1.1.0"
   },
   "devDependencies": {
-    "@rollup/pluginutils": "^5.3.0",
-    "@types/node": "^25.6.2",
-    "@types/react": "^19.2.14",
-    "@types/react-dom": "^19.2.3",
-    "@vitejs/plugin-react": "^6.0.1",
-    "react": "^19.2.6",
-    "react-dom": "^19.2.6",
-    "rollup": "^4.60.3",
-    "three": "^0.184.0",
-    "tsup": "^8.5.1",
-    "typescript": "^6.0.3",
-    "vite": "^8.0.11"
+    "@types/node": "latest",
+    "eslint": "^10.4.1",
+    "hookable": "^5.5.3",
+    "playwright-core": "^1.61.1",
+    "tsdown": "^0.20.3",
+    "typescript": "~6.0.3",
+    "unhead": "^2.1.0",
+    "vite": "^7.3.5",
+    "vitest": "^4.1.8",
+    "vue": "3.5.39"
   },
-  "dependencies": {
-    "esbuild": "^0.28.0"
+  "scripts": {
+    "build": "tsdown",
+    "dev": "vitest dev",
+    "lint": "eslint .",
+    "test": "pnpm test:unit && pnpm test:types",
+    "test:unit": "vitest run",
+    "test:types": "tsc --noEmit && vitest run --typecheck.only"
   }
-}
+}

package/dist/index.d.ts

@@ -1,17 +0,0 @@
-import { Plugin } from 'vite';
-
-interface CosPluginOptions {
-    /**
-     * Pattern to include chunks to be managed by COS.
-     * Matches against the output filename (e.g. `assets/vendor-*.js`).
-     * Default: `['**\/*']` (all chunks, except the entry implementation detail)
-     */
-    include?: string | RegExp | (string | RegExp)[];
-    /**
-     * Pattern to exclude chunks from being managed by COS.
-     */
-    exclude?: string | RegExp | (string | RegExp)[];
-}
-declare function cosPlugin(options?: CosPluginOptions): Plugin;
-
-export { type CosPluginOptions, cosPlugin as default };