npm - vite-plugin-cross-origin-storage - Versions diffs - 1.6.0 → 1.8.0 - Mend

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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (5) hide show

package/README.md CHANGED Viewed

@@ -95,26 +95,39 @@ export default defineConfig({
 ## How It Works
-1. **Build Time**:
-   - The plugin analyzes your bundle and identifies chunks matching the
-     `include` pattern.
-   - It generates a stable hash for each managed chunk.
-   - It rewrites imports in your code to look for a global variable (e.g.,
-     `window.__COS_CHUNK_...`) containing the Blob URL of the chunk, falling
-     back to the relative network path if the variable is unset.
-   - It disables the default `<script type="module" src="...">` entry point in
-     your `index.html` and injects a custom `loader.js`.
-2. **Runtime**:
-   - The injected loader checks for `navigator.crossOriginStorage`.
-   - If supported, it requests the file handle for each managed chunk using its
-     hash.
-   - **Cache Hit**: If found, it creates a Blob URL and assigns it to the
-     corresponding global variable.
-   - **Cache Miss**: If not found, it fetches the file from the network, stores
-     it in COS, and then creates the Blob URL.
-   - Finally, the loader imports your application's entry point, which now
-     seamlessly uses the cached assets.
+### Build Time
+1. **Magic Externals**: For `include` patterns that resolve to npm package
+   names (e.g. `vendor-react` → `react`), the plugin externalizes the package
+   from Rollup and uses esbuild to produce a single self-contained ESM bundle.
+   This bundle is emitted as a hashed asset (e.g. `assets/react-a1b2c3d4.js`)
+   and treated as a managed chunk.
+2. **Import Rewriting**: All inter-chunk imports are rewritten from relative
+   paths (`"./chunk.js"`) to bare specifiers (`"coschunk-assets-chunk-js"`).
+   This applies to both managed and unmanaged chunks, because managed chunks
+   run as Blob URLs and cannot resolve relative paths at runtime.
+3. **Manifest Generation**: A JSON manifest is built containing the base path,
+   the entry chunk filename, a map of every managed chunk filename to its
+   SHA-256 hash, and a list of unmanaged chunks that need network-URL entries
+   in the import map.
+4. **Loader Injection**: The plugin disables the default
+   `<script type="module">` entry tag and injects a `<script id="cos-loader">`
+   containing the runtime loader with the manifest inlined.
+### Runtime
+1. The loader checks for `navigator.crossOriginStorage`.
+2. For each managed chunk it calls
+   `navigator.crossOriginStorage.requestFileHandles([{ algorithm: 'SHA-256', value: hash }])`:
+   - **Cache hit**: wraps the returned `File` as a Blob URL.
+   - **Cache miss**: fetches the chunk from the network, stores it in COS via
+     `requestFileHandles(..., { create: true })`, then wraps it as a Blob URL.
+3. Unmanaged chunks receive absolute network URLs.
+4. An `<script type="importmap">` is injected into `<head>` mapping every
+   `coschunk-*` bare specifier to its resolved URL.
+5. The entry point is imported via its bare specifier inside a `setTimeout`
+   callback so the browser has time to register the import map before the
+   first module resolution occurs.
 ## Requirements

package/dist/index.js CHANGED Viewed

@@ -30,6 +30,7 @@ var require_constants = __commonJS({
     "use strict";
     var WIN_SLASH = "\\\\/";
     var WIN_NO_SLASH = `[^${WIN_SLASH}]`;
+    var DEFAULT_MAX_EXTGLOB_RECURSION = 0;
     var DOT_LITERAL = "\\.";
     var PLUS_LITERAL = "\\+";
     var QMARK_LITERAL = "\\?";
@@ -80,6 +81,7 @@ var require_constants = __commonJS({
       SEP: "\\"
     };
     var POSIX_REGEX_SOURCE = {
+      __proto__: null,
       alnum: "a-zA-Z0-9",
       alpha: "a-zA-Z",
       ascii: "\\x00-\\x7F",
@@ -96,6 +98,7 @@ var require_constants = __commonJS({
       xdigit: "A-Fa-f0-9"
     };
     module.exports = {
+      DEFAULT_MAX_EXTGLOB_RECURSION,
       MAX_LENGTH: 1024 * 64,
       POSIX_REGEX_SOURCE,
       // regular expressions
@@ -646,6 +649,213 @@ var require_parse = __commonJS({
     var syntaxError = (type, char) => {
       return `Missing ${type}: "${char}" - use "\\\\${char}" to match literal characters`;
     };
+    var splitTopLevel = (input) => {
+      const parts = [];
+      let bracket = 0;
+      let paren = 0;
+      let quote = 0;
+      let value = "";
+      let escaped = false;
+      for (const ch of input) {
+        if (escaped === true) {
+          value += ch;
+          escaped = false;
+          continue;
+        }
+        if (ch === "\\") {
+          value += ch;
+          escaped = true;
+          continue;
+        }
+        if (ch === '"') {
+          quote = quote === 1 ? 0 : 1;
+          value += ch;
+          continue;
+        }
+        if (quote === 0) {
+          if (ch === "[") {
+            bracket++;
+          } else if (ch === "]" && bracket > 0) {
+            bracket--;
+          } else if (bracket === 0) {
+            if (ch === "(") {
+              paren++;
+            } else if (ch === ")" && paren > 0) {
+              paren--;
+            } else if (ch === "|" && paren === 0) {
+              parts.push(value);
+              value = "";
+              continue;
+            }
+          }
+        }
+        value += ch;
+      }
+      parts.push(value);
+      return parts;
+    };
+    var isPlainBranch = (branch) => {
+      let escaped = false;
+      for (const ch of branch) {
+        if (escaped === true) {
+          escaped = false;
+          continue;
+        }
+        if (ch === "\\") {
+          escaped = true;
+          continue;
+        }
+        if (/[?*+@!()[\]{}]/.test(ch)) {
+          return false;
+        }
+      }
+      return true;
+    };
+    var normalizeSimpleBranch = (branch) => {
+      let value = branch.trim();
+      let changed = true;
+      while (changed === true) {
+        changed = false;
+        if (/^@\([^\\()[\]{}|]+\)$/.test(value)) {
+          value = value.slice(2, -1);
+          changed = true;
+        }
+      }
+      if (!isPlainBranch(value)) {
+        return;
+      }
+      return value.replace(/\\(.)/g, "$1");
+    };
+    var hasRepeatedCharPrefixOverlap = (branches) => {
+      const values = branches.map(normalizeSimpleBranch).filter(Boolean);
+      for (let i = 0; i < values.length; i++) {
+        for (let j = i + 1; j < values.length; j++) {
+          const a = values[i];
+          const b = values[j];
+          const char = a[0];
+          if (!char || a !== char.repeat(a.length) || b !== char.repeat(b.length)) {
+            continue;
+          }
+          if (a === b || a.startsWith(b) || b.startsWith(a)) {
+            return true;
+          }
+        }
+      }
+      return false;
+    };
+    var parseRepeatedExtglob = (pattern, requireEnd = true) => {
+      if (pattern[0] !== "+" && pattern[0] !== "*" || pattern[1] !== "(") {
+        return;
+      }
+      let bracket = 0;
+      let paren = 0;
+      let quote = 0;
+      let escaped = false;
+      for (let i = 1; i < pattern.length; i++) {
+        const ch = pattern[i];
+        if (escaped === true) {
+          escaped = false;
+          continue;
+        }
+        if (ch === "\\") {
+          escaped = true;
+          continue;
+        }
+        if (ch === '"') {
+          quote = quote === 1 ? 0 : 1;
+          continue;
+        }
+        if (quote === 1) {
+          continue;
+        }
+        if (ch === "[") {
+          bracket++;
+          continue;
+        }
+        if (ch === "]" && bracket > 0) {
+          bracket--;
+          continue;
+        }
+        if (bracket > 0) {
+          continue;
+        }
+        if (ch === "(") {
+          paren++;
+          continue;
+        }
+        if (ch === ")") {
+          paren--;
+          if (paren === 0) {
+            if (requireEnd === true && i !== pattern.length - 1) {
+              return;
+            }
+            return {
+              type: pattern[0],
+              body: pattern.slice(2, i),
+              end: i
+            };
+          }
+        }
+      }
+    };
+    var getStarExtglobSequenceOutput = (pattern) => {
+      let index = 0;
+      const chars = [];
+      while (index < pattern.length) {
+        const match = parseRepeatedExtglob(pattern.slice(index), false);
+        if (!match || match.type !== "*") {
+          return;
+        }
+        const branches = splitTopLevel(match.body).map((branch2) => branch2.trim());
+        if (branches.length !== 1) {
+          return;
+        }
+        const branch = normalizeSimpleBranch(branches[0]);
+        if (!branch || branch.length !== 1) {
+          return;
+        }
+        chars.push(branch);
+        index += match.end + 1;
+      }
+      if (chars.length < 1) {
+        return;
+      }
+      const source = chars.length === 1 ? utils.escapeRegex(chars[0]) : `[${chars.map((ch) => utils.escapeRegex(ch)).join("")}]`;
+      return `${source}*`;
+    };
+    var repeatedExtglobRecursion = (pattern) => {
+      let depth = 0;
+      let value = pattern.trim();
+      let match = parseRepeatedExtglob(value);
+      while (match) {
+        depth++;
+        value = match.body.trim();
+        match = parseRepeatedExtglob(value);
+      }
+      return depth;
+    };
+    var analyzeRepeatedExtglob = (body, options) => {
+      if (options.maxExtglobRecursion === false) {
+        return { risky: false };
+      }
+      const max = typeof options.maxExtglobRecursion === "number" ? options.maxExtglobRecursion : constants.DEFAULT_MAX_EXTGLOB_RECURSION;
+      const branches = splitTopLevel(body).map((branch) => branch.trim());
+      if (branches.length > 1) {
+        if (branches.some((branch) => branch === "") || branches.some((branch) => /^[*?]+$/.test(branch)) || hasRepeatedCharPrefixOverlap(branches)) {
+          return { risky: true };
+        }
+      }
+      for (const branch of branches) {
+        const safeOutput = getStarExtglobSequenceOutput(branch);
+        if (safeOutput) {
+          return { risky: true, safeOutput };
+        }
+        if (repeatedExtglobRecursion(branch) > max) {
+          return { risky: true };
+        }
+      }
+      return { risky: false };
+    };
     var parse = (input, options) => {
       if (typeof input !== "string") {
         throw new TypeError("Expected a string");
@@ -776,6 +986,8 @@ var require_parse = __commonJS({
         token.prev = prev;
         token.parens = state.parens;
         token.output = state.output;
+        token.startIndex = state.index;
+        token.tokensIndex = tokens.length;
         const output = (opts.capture ? "(" : "") + token.open;
         increment("parens");
         push({ type, value: value2, output: state.output ? "" : ONE_CHAR });
@@ -783,6 +995,26 @@ var require_parse = __commonJS({
         extglobs.push(token);
       };
       const extglobClose = (token) => {
+        const literal = input.slice(token.startIndex, state.index + 1);
+        const body = input.slice(token.startIndex + 2, state.index);
+        const analysis = analyzeRepeatedExtglob(body, opts);
+        if ((token.type === "plus" || token.type === "star") && analysis.risky) {
+          const safeOutput = analysis.safeOutput ? (token.output ? "" : ONE_CHAR) + (opts.capture ? `(${analysis.safeOutput})` : analysis.safeOutput) : void 0;
+          const open = tokens[token.tokensIndex];
+          open.type = "text";
+          open.value = literal;
+          open.output = safeOutput || utils.escapeRegex(literal);
+          for (let i = token.tokensIndex + 1; i < tokens.length; i++) {
+            tokens[i].value = "";
+            tokens[i].output = "";
+            delete tokens[i].suffix;
+          }
+          state.output = token.output + open.output;
+          state.backtrack = true;
+          push({ type: "paren", extglob: true, value, output: "" });
+          decrement("parens");
+          return;
+        }
         let output = token.close + (opts.capture ? ")" : "");
         let rest;
         if (token.type === "negate") {
@@ -1626,6 +1858,22 @@ function cosPlugin(options = {}) {
   const __dirname = path.dirname(fileURLToPath(import.meta.url));
   const loaderPath = path.resolve(__dirname, "./loader.js");
   let config;
+  const cwdRequire = createRequire(path.join(process.cwd(), "index.js"));
+  const esbuildRequire = createRequire(import.meta.url);
+  const esbuild = esbuildRequire("esbuild");
+  const include = options.include || ["**/*"];
+  const includeArray = Array.isArray(include) ? include : [include];
+  function getPackageName(item) {
+    if (typeof item === "string") {
+      return item.startsWith("vendor-") ? item.replace("vendor-", "") : item;
+    }
+    if (item instanceof RegExp) {
+      const source = item.source;
+      const match = source.match(/vendor-([a-zA-Z0-9-@/]+?)(?:[-._]|\/|$)/);
+      return match ? match[1] : null;
+    }
+    return null;
+  }
   return {
     name: "vite-plugin-cos",
     apply: "build",
@@ -1635,31 +1883,19 @@ function cosPlugin(options = {}) {
       config2.build.rollupOptions = config2.build.rollupOptions || {};
       const external = config2.build.rollupOptions.external || [];
       const externalArray = Array.isArray(external) ? external : typeof external === "string" ? [external] : [];
-      const include = options.include || ["**/*"];
-      const includeArray = Array.isArray(include) ? include : [include];
-      const require2 = createRequire(path.join(process.cwd(), "index.js"));
-      function getPackageName(item) {
-        if (typeof item === "string") {
-          return item.startsWith("vendor-") ? item.replace("vendor-", "") : item;
-        }
-        if (item instanceof RegExp) {
-          const source = item.source;
-          const match = source.match(/vendor-([a-zA-Z0-9-@/]+?)(?:[-._]|\/|$)/);
-          return match ? match[1] : null;
-        }
-        return null;
-      }
       for (const item of includeArray) {
         const pkgName = getPackageName(item);
         if (pkgName) {
           try {
-            require2.resolve(pkgName);
-            const pkgRegex = new RegExp(`^${pkgName}(?:/.*)?$`);
-            if (!externalArray.some((e) => e instanceof RegExp && e.source === pkgRegex.source)) {
-              console.log(
-                `COS Plugin: [MAGIC] Externalizing package and subpaths: ${pkgRegex} (matched from ${item})`
-              );
-              externalArray.push(pkgRegex);
+            cwdRequire.resolve(pkgName);
+            const externalPatterns = [pkgName, `${pkgName}/*`];
+            for (const pattern of externalPatterns) {
+              if (!externalArray.includes(pattern)) {
+                console.log(
+                  `COS Plugin: [MAGIC] Externalizing pattern "${pattern}" (matched from ${item})`
+                );
+                externalArray.push(pattern);
+              }
             }
           } catch (e) {
           }
@@ -1674,7 +1910,7 @@ function cosPlugin(options = {}) {
       order: "post",
       handler(html) {
         return html.replace(
-          /<script\s+[^>]*type=["']module["'][^>]*src=["'][^"']*index[^"']*["'][^>]*><\/script>/gi,
+          /<script\s+[^>]*type=["']module["'][^>]*src=["'][^"']+["'][^>]*><\/script>/gi,
           "<!-- Entry script disabled by COS Plugin -->"
         );
       }
@@ -1682,7 +1918,7 @@ function cosPlugin(options = {}) {
     async generateBundle(_options, bundle) {
       const managedChunks = {};
       let mainChunk = null;
-      let htmlAsset = null;
+      const htmlAssets = [];
       for (const fileName in bundle) {
         const chunk = bundle[fileName];
         if (chunk.type === "chunk") {
@@ -1698,61 +1934,45 @@ function cosPlugin(options = {}) {
             managedChunks[fileName] = chunk;
           }
         }
-        if (fileName === "index.html" && chunk.type === "asset") {
-          htmlAsset = chunk;
+        if (fileName.endsWith(".html") && chunk.type === "asset") {
+          htmlAssets.push(chunk);
         }
       }
       const externalToFileName = {};
-      const require2 = createRequire(path.join(process.cwd(), "index.js"));
-      const include = options.include || ["**/*"];
-      const includeArray = Array.isArray(include) ? include : [include];
-      function getPackageName(item) {
-        if (typeof item === "string") {
-          return item.startsWith("vendor-") ? item.replace("vendor-", "") : item;
-        }
-        if (item instanceof RegExp) {
-          const source = item.source;
-          const match = source.match(/vendor-([a-zA-Z0-9-@/]+?)(?:[-._]|\/|$)/);
-          return match ? match[1] : null;
-        }
-        return null;
-      }
-      const magicPackages = /* @__PURE__ */ new Set();
       for (const item of includeArray) {
         const pkgName = getPackageName(item);
-        if (pkgName) {
+        if (!pkgName) continue;
+        try {
+          let pkgPath = "";
           try {
-            require2.resolve(pkgName);
-            magicPackages.add(pkgName);
-          } catch (e) {
-          }
-        }
-      }
-      const discoveredSpecifiers = /* @__PURE__ */ new Set();
-      const allChunks = Object.values(bundle).filter(
-        (c) => c.type === "chunk"
-      );
-      for (const chunk of allChunks) {
-        const allImports = [...chunk.imports, ...chunk.dynamicImports];
-        for (const specifier of allImports) {
-          for (const pkgName of magicPackages) {
-            if (specifier === pkgName || specifier.startsWith(`${pkgName}/`)) {
-              discoveredSpecifiers.add(specifier);
-              break;
+            const mainPath = cwdRequire.resolve(pkgName);
+            let currentDir = path.dirname(mainPath);
+            let pkgJsonPath = "";
+            while (currentDir !== path.parse(currentDir).root) {
+              const candidate = path.join(currentDir, "package.json");
+              if (fs.existsSync(candidate)) {
+                pkgJsonPath = candidate;
+                break;
+              }
+              currentDir = path.dirname(currentDir);
             }
+            if (pkgJsonPath) {
+              const pkgJson = JSON.parse(fs.readFileSync(pkgJsonPath, "utf-8"));
+              const pkgDir = path.dirname(pkgJsonPath);
+              if (pkgJson.module) {
+                pkgPath = path.resolve(pkgDir, pkgJson.module);
+              } else if (pkgJson.exports?.["."]?.import) {
+                pkgPath = path.resolve(pkgDir, pkgJson.exports["."].import);
+              } else if (pkgJson.exports?.import) {
+                pkgPath = path.resolve(pkgDir, pkgJson.exports.import);
+              }
+            }
+            if (!pkgPath) {
+              pkgPath = mainPath;
+            }
+          } catch (e) {
+            pkgPath = cwdRequire.resolve(pkgName);
           }
-        }
-      }
-      const specifierToCode = {};
-      for (const specifier of discoveredSpecifiers) {
-        try {
-          const pkgPath = require2.resolve(specifier);
-          const pkgName = Array.from(magicPackages).find((p) => specifier === p || specifier.startsWith(`${p}/`));
-          const otherSpecifiersFromSamePkg = Array.from(discoveredSpecifiers).filter(
-            (s) => s !== specifier && (s === pkgName || s.startsWith(`${pkgName}/`))
-          );
-          const esbuildRequire = createRequire(import.meta.url);
-          const esbuild = esbuildRequire("esbuild");
           const buildResult = await esbuild.build({
             entryPoints: [pkgPath],
             bundle: true,
@@ -1760,32 +1980,19 @@ function cosPlugin(options = {}) {
             minify: true,
             platform: "browser",
             write: false,
+            // Don't write to disk
             target: "esnext",
-            // Mark other components of the same library as external to avoid duplication
-            external: otherSpecifiersFromSamePkg,
+            // Neutralize environment
             define: {
               "process.env.NODE_ENV": '"production"'
             }
           });
-          let code = buildResult.outputFiles[0].text;
-          for (const otherSpec of otherSpecifiersFromSamePkg) {
-            const escapedOtherSpec = otherSpec.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
-            const bareSpecifier = `coschunk-${otherSpec.replace(/[/@]/g, "-")}`;
-            const staticRegex = new RegExp(`(import|export)\\b\\s*((?:(?!\\bimport\\b|\\bexport\\b)[\\s\\S])*?\\bfrom\\b\\s*)?['"]${escapedOtherSpec}['"]\\s*;?`, "g");
-            code = code.replace(staticRegex, (match, keyword, fromPart) => {
-              return `${keyword}${fromPart ? " " + fromPart : " "}"${bareSpecifier}";`;
-            });
-            const dynamicRegex = new RegExp(`import\\s*\\(\\s*['"]${escapedOtherSpec}['"]\\s*\\)`, "g");
-            code = code.replace(dynamicRegex, () => `import("${bareSpecifier}")`);
-          }
-          specifierToCode[specifier] = code;
-          const content = Buffer.from(code);
+          const content = buildResult.outputFiles[0].contents;
           const hash = crypto.createHash("sha256").update(content).digest("hex");
           const ext = ".js";
-          const safeSpecifier = specifier.replace(/[/@]/g, "-").replace(/\.js$/, "");
           const fileName = path.join(
             config.build.assetsDir,
-            `${safeSpecifier}-${hash.slice(0, 8)}${ext}`
+            `${pkgName}-${hash.slice(0, 8)}${ext}`
           );
           this.emitFile({
             type: "asset",
@@ -1795,27 +2002,21 @@ function cosPlugin(options = {}) {
           managedChunks[fileName] = {
             type: "chunk",
             fileName,
-            code,
-            name: specifier
+            code: Buffer.from(content).toString("utf-8"),
+            name: item
           };
-          externalToFileName[specifier] = fileName;
+          externalToFileName[pkgName] = fileName;
         } catch (e) {
-          console.error(`COS Plugin: Failed to bundle magic specifier "${specifier}"`, e);
         }
       }
       if (mainChunk) {
-        const magicMapping = {};
-        for (const specifier in externalToFileName) {
-          const bareSpecifier = `coschunk-${specifier.replace(/[/@]/g, "-")}`;
-          magicMapping[bareSpecifier] = externalToFileName[specifier];
-        }
-        const allChunks2 = Object.values(bundle).filter(
+        const allChunks = Object.values(bundle).filter(
           (c) => c.type === "chunk"
         );
         const managedChunkNames = new Set(Object.keys(managedChunks));
         const unmanagedDependencies = /* @__PURE__ */ new Set();
         const base = config.base.endsWith("/") ? config.base : config.base + "/";
-        for (const targetChunk of allChunks2) {
+        for (const targetChunk of allChunks) {
           const importerDir = path.dirname(targetChunk.fileName);
           const deps = [...targetChunk.imports, ...targetChunk.dynamicImports];
           for (const depFileName of deps) {
@@ -1848,7 +2049,8 @@ function cosPlugin(options = {}) {
             }
           }
           for (const pkgName in externalToFileName) {
-            const bareSpecifier = `coschunk-${pkgName.replace(/[/@]/g, "-")}`;
+            const fileName = externalToFileName[pkgName];
+            const bareSpecifier = `coschunk-${fileName.replace(/\//g, "-")}`;
             const staticPattern = `(import|export)\\b\\s*((?:(?!\\bimport\\b|\\bexport\\b)[\\s\\S])*?\\bfrom\\b\\s*)?['"]${pkgName}['"]\\s*;?`;
             const staticRegex = new RegExp(staticPattern, "g");
             targetChunk.code = targetChunk.code.replace(
@@ -1868,8 +2070,7 @@ function cosPlugin(options = {}) {
         const manifest = {
           base,
           entry: mainChunk.fileName,
-          chunks: {},
-          magic: magicMapping
+          chunks: {}
         };
         for (const fileName in managedChunks) {
           const chunk = managedChunks[fileName];
@@ -1880,13 +2081,19 @@ function cosPlugin(options = {}) {
           unmanagedDependencies.add(mainChunk.fileName);
         }
         manifest.unmanaged = Array.from(unmanagedDependencies);
-        if (htmlAsset) {
+        if (htmlAssets.length > 0) {
+          let loaderCode;
           try {
-            let loaderCode = fs.readFileSync(loaderPath, "utf-8");
-            loaderCode = loaderCode.replace(
-              "__COS_MANIFEST__",
-              JSON.stringify(manifest, null, 2)
-            );
+            loaderCode = fs.readFileSync(loaderPath, "utf-8");
+          } catch (e) {
+            console.error("COS Plugin: Failed to read loader.js", e);
+            return;
+          }
+          loaderCode = loaderCode.replace(
+            "__COS_MANIFEST__",
+            JSON.stringify(manifest, null, 2)
+          );
+          for (const htmlAsset of htmlAssets) {
             let htmlSource = htmlAsset.source;
             htmlSource = htmlSource.replace(
               /<link\s+[^>]*rel=["']modulepreload["'][^>]*>/gi,
@@ -1897,8 +2104,6 @@ function cosPlugin(options = {}) {
               () => `<head>
 <script id="cos-loader">${loaderCode}</script>`
             );
-          } catch (e) {
-            console.error("COS Plugin: Failed to read loader.js", e);
           }
         }
       }

package/dist/loader.js CHANGED Viewed

@@ -111,18 +111,6 @@
     // Inject Import Map
     const script = document.createElement('script');
     script.type = 'importmap';
-    // Add magic specifier mappings (e.g. coschunk-three -> assets/three-*.js)
-    if (manifest.magic) {
-      for (const [specifier, fileName] of Object.entries(manifest.magic)) {
-        const targetSpecifier = `coschunk-${fileName.replace(/\//g, '-')}`;
-        const targetUrl = importMap.imports[targetSpecifier];
-        if (targetUrl) {
-          importMap.imports[specifier] = targetUrl;
-        }
-      }
-    }
     script.textContent = JSON.stringify(importMap, null, 2);
     document.head.appendChild(script);
@@ -132,13 +120,14 @@
     // through the import map and can find other managed chunks.
     const entrySpecifier = `coschunk-${mainEntry.replace(/\//g, '-')}`;
-    // Small delay to ensure the browser has fully registered the
-    // import map before resolving the first module.
-    setTimeout(() => {
-      import(entrySpecifier).catch((err) => {
-        console.error('COS Loader: Failed to start app', err);
-      });
-    }, 0);
+    // Yield to the event loop once so the browser registers the dynamically
+    // injected import map before the first module import.
+    await new Promise((resolve) => setTimeout(resolve, 0));
+    try {
+      await import(entrySpecifier);
+    } catch (err) {
+      console.error('COS Loader: Failed to start app', err);
+    }
   } catch (err) {
     console.error('COS Loader: Initialization failed', err);
   }

package/loader.js CHANGED Viewed

@@ -111,18 +111,6 @@
     // Inject Import Map
     const script = document.createElement('script');
     script.type = 'importmap';
-    // Add magic specifier mappings (e.g. coschunk-three -> assets/three-*.js)
-    if (manifest.magic) {
-      for (const [specifier, fileName] of Object.entries(manifest.magic)) {
-        const targetSpecifier = `coschunk-${fileName.replace(/\//g, '-')}`;
-        const targetUrl = importMap.imports[targetSpecifier];
-        if (targetUrl) {
-          importMap.imports[specifier] = targetUrl;
-        }
-      }
-    }
     script.textContent = JSON.stringify(importMap, null, 2);
     document.head.appendChild(script);
@@ -132,13 +120,14 @@
     // through the import map and can find other managed chunks.
     const entrySpecifier = `coschunk-${mainEntry.replace(/\//g, '-')}`;
-    // Small delay to ensure the browser has fully registered the
-    // import map before resolving the first module.
-    setTimeout(() => {
-      import(entrySpecifier).catch((err) => {
-        console.error('COS Loader: Failed to start app', err);
-      });
-    }, 0);
+    // Yield to the event loop once so the browser registers the dynamically
+    // injected import map before the first module import.
+    await new Promise((resolve) => setTimeout(resolve, 0));
+    try {
+      await import(entrySpecifier);
+    } catch (err) {
+      console.error('COS Loader: Failed to start app', err);
+    }
   } catch (err) {
     console.error('COS Loader: Initialization failed', err);
   }

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "vite-plugin-cross-origin-storage",
-  "version": "1.6.0",
+  "version": "1.8.0",
   "description": "Vite plugin to load chunks from Cross-Origin Storage",
   "keywords": [
     "vite",
@@ -37,23 +37,34 @@
   "scripts": {
     "build": "tsup index.ts --format esm --dts --clean && cp loader.js dist/",
     "prepublishOnly": "npm run build",
-    "test:dev": "npm run build && vite testing",
-    "test:build": "npm run build && vite build testing",
-    "test:preview": "vite preview testing"
+    "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"
   },
   "peerDependencies": {
-    "vite": "^4.0.0 || ^5.0.0 || ^6.0.0 || ^7.0.0"
+    "vite": "^4.0.0 || ^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0"
   },
   "devDependencies": {
     "@rollup/pluginutils": "^5.3.0",
-    "@types/node": "^25.2.3",
-    "rollup": "^4.57.1",
-    "three": "^0.183.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": "^5.9.3",
-    "vite": "^7.3.1"
+    "typescript": "^6.0.3",
+    "vite": "^8.0.11"
   },
   "dependencies": {
-    "esbuild": "^0.27.3"
+    "esbuild": "^0.28.0"
   }
 }