>>> [!note] Migrated issue <!-- Drupal.org comment --> <!-- Migrated from issue #3566465. --> Reported by: [balintbrews](https://www.drupal.org/user/613760) Related to !465 !462 !458 !452 >>> <h3>Overview</h3> <p>The <code>astro-hydration</code> build produces separate chunks for <code>clsx</code> and <code>tailwind-merge</code> when they're imported by <a href="https://git.drupalcode.org/project/canvas/-/blob/b12d503ed7b902c59b19179d0634d16a3d4051de/packages/drupal-canvas/src/utils.ts"><code>drupal-canvas/utils</code></a>.</p> <p>These chunks are imported via relative paths (e.g., <code>import {c as o} from "./clsx.js"</code>), which bypass the cache-busting mechanism applied to entries in Canvas's import map (added in <span class="drupalorg-gitlab-issue-link project-issue-status-info project-issue-status-7"><a href="https://www.drupal.org/project/experience_builder/issues/3536093" title="Status: Closed (fixed)">#3536093: Provide cache buster query string for imports + UI</a></span>).</p> <p>This can cause runtime errors after deployments when old chunk versions are cached at edge or in browsers. The minified export names are not stable across builds (e.g., <code>export {i as c}</code>). When a browser loads a new <code>utils.js</code> expecting <code>export {i as c}</code> but serves a cached <code>clsx.js</code> with <code>export {i as x}</code>, the import fails:</p> <pre><pre>Uncaught SyntaxError: The requested module './clsx.js' does not provide an export named 'c'</pre></pre><h3>Proposed resolution</h3> <p>A solution was delivered in <a href="https://git.drupalcode.org/project/canvas/-/commit/13a8f384cc3f42af4e29e0afc52ffdd03fd322a7"><code>13a8f384</code></a>, but a much better suggestion came from @wotnak in <a href="https://www.drupal.org#comment-16408648">#9</a>.</p> > Related issue: [Issue #3536093](https://www.drupal.org/node/3536093) > Related issue: [Issue #3537408](https://www.drupal.org/node/3537408)