| 58 | 58 | | output: { |
| 59 | 59 | | codeSplitting: { |
| 60 | 60 | | groups: [ |
| 61 | + | // React and react-dom are CommonJS, which the bundler wraps in |
| 62 | + | // initialisers that a chunk calls while it loads. Left to |
| 63 | + | // automatic splitting, react-dom's landed in an app chunk that |
| 64 | + | // imports the chunk calling it, so that chunk ran first and |
| 65 | + | // threw `s is not a function`: tooltips, cards, menus and the |
| 66 | + | // spend pill never came up. In a chunk of their own, which |
| 67 | + | // imports nothing of the app's, they are always ready first. |
| 68 | + | { name: "react", test: /[\\/]node_modules[\\/](react|react-dom|scheduler|use-sync-external-store|react-is)[\\/]/, priority: 3 }, |
| 69 | + | // The UI primitives behind shadcn's components (Radix, and the |
| 70 | + | // floating-ui that positions tooltips, cards and menus) set |
| 71 | + | // themselves up while they load, calling each other. Inside the |
| 72 | + | // app's chunks they could end up in two that import each other, |
| 73 | + | // and whichever a page loaded first would call into the other |
| 74 | + | // before it was ready. Together, apart from the app, they can't. |
| 75 | + | { name: "ui", test: /[\\/]node_modules[\\/](radix-ui|@radix-ui[\\/][^\\/]+|@floating-ui[\\/][^\\/]+|aria-hidden|react-remove-scroll[^\\/]*|use-callback-ref|use-sidecar|react-style-singleton|get-nonce|tslib|detect-node-es)[\\/]/, priority: 3 }, |
| 61 | 76 | | // Icons are shared by nearly every page, a few hundred bytes each: |
| 62 | 77 | | // one file for all of them, not a request per icon. |
| 63 | 78 | | { name: "icons", test: /[\\/]node_modules[\\/]lucide-react[\\/]/, priority: 2 }, |
