⚡ chore: Upgrade Vite For Node 24 (#13450)

* chore: upgrade vite for node 24

* fix: restore production vite boot

* fix: preserve dynamic pwa shell

client/package.json

@@ -111,7 +111,7 @@
     "remark-gfm": "^4.0.0",
     "remark-math": "^6.0.0",
     "remark-supersub": "^1.0.0",
-    "sse.js": "^2.5.0",
+    "sse.js": "^2.8.0",
     "swr": "^2.3.8",
     "tailwind-merge": "^1.9.1",
     "tailwindcss-animate": "^1.0.5",
@@ -136,7 +136,7 @@
     "@types/node": "^24.12.4",
     "@types/react": "^18.2.11",
     "@types/react-dom": "^18.2.4",
-    "@vitejs/plugin-react": "^5.1.4",
+    "@vitejs/plugin-react": "^6.0.2",
     "autoprefixer": "^10.4.20",
     "babel-plugin-replace-ts-export-assignment": "^0.0.2",
     "babel-plugin-root-import": "^6.6.0",
@@ -155,9 +155,9 @@
     "postcss-preset-env": "^11.2.0",
     "tailwindcss": "^3.4.1",
     "typescript": "^5.3.3",
-    "vite": "^7.3.1",
-    "vite-plugin-compression2": "^2.2.1",
-    "vite-plugin-node-polyfills": "^0.25.0",
-    "vite-plugin-pwa": "^1.2.0"
+    "vite": "^8.0.16",
+    "vite-plugin-compression2": "^2.5.3",
+    "vite-plugin-node-polyfills": "^0.28.0",
+    "vite-plugin-pwa": "^1.3.0"
   }
 }

client/src/components/Skills/index.ts

@@ -2,7 +2,6 @@ export * from './buttons';
 export * from './dialogs';
 export * from './display';
 export * from './forms';
-export * from './layouts';
 export * from './lists';
 export * from './sidebar';
 export * from './tree';

client/src/main.jsx

@@ -1,4 +1,4 @@
-import 'regenerator-runtime/runtime';
+import './polyfills/regeneratorRuntime';
 import { createRoot } from 'react-dom/client';
 import './locales/i18n';
 import App from './App';

client/src/polyfills/regeneratorRuntime.js

@@ -0,0 +1,3 @@
+import regeneratorRuntime from 'regenerator-runtime/runtime';
+
+globalThis.regeneratorRuntime ??= regeneratorRuntime;

client/vite.config.ts

@@ -12,7 +12,7 @@ const require = createRequire(import.meta.url);
 /**
  * vite-plugin-node-polyfills uses @rollup/plugin-inject to replace bare globals (e.g. `process`)
  * with imports like `import process from 'vite-plugin-node-polyfills/shims/process'`. When the
- * consuming module (e.g. recoil) is hoisted to the monorepo root, Vite 7's ESM resolver walks up
+ * consuming module (e.g. recoil) is hoisted to the monorepo root, Vite's ESM resolver walks up
  * from there and never finds the shims (installed only in client/node_modules). This map resolves
  * the shim specifiers to absolute paths via CJS require.resolve anchored to the client directory.
  */
@@ -84,7 +84,8 @@ export default defineConfig(({ command }) => ({
         ],
         globIgnores: ['images/**/*', '**/*.map', 'index.html', 'assets/rum.*.js'],
         maximumFileSizeToCacheInBytes: 4 * 1024 * 1024,
-        navigateFallbackDenylist: [/^\/oauth/, /^\/api/],
+        /** LibreChat mutates index.html per request for subpath and language support. */
+        navigateFallback: null,
       },
       includeAssets: [],
       manifest: {
@@ -133,164 +134,186 @@ export default defineConfig(({ command }) => ({
     sourcemap: process.env.NODE_ENV === 'development',
     outDir: './dist',
     minify: 'terser',
-    rollupOptions: {
+    rolldownOptions: {
       preserveEntrySignatures: 'strict',
       output: {
-        manualChunks(id: string) {
-          const normalizedId = id.replace(/\\/g, '/');
-          if (normalizedId.includes('node_modules')) {
-            if (normalizedId.includes('@hyperdx/')) {
-              return 'rum';
-            }
+        codeSplitting: {
+          groups: [
+            {
+              name(id: string) {
+                const normalizedId = id.replace(/\\/g, '/');
+                if (normalizedId.includes('node_modules')) {
+                  if (normalizedId.includes('/node_modules/regenerator-runtime/')) {
+                    return 'polyfills';
+                  }
 
-            // IMPORTANT: mermaid and ALL its dependencies must be in the same chunk
-            // to avoid initialization order issues. This includes chevrotain, langium,
-            // dagre-d3-es, and their nested lodash-es dependencies.
-            if (
-              normalizedId.includes('mermaid') ||
-              normalizedId.includes('dagre-d3-es') ||
-              normalizedId.includes('chevrotain') ||
-              normalizedId.includes('langium') ||
-              normalizedId.includes('lodash-es')
-            ) {
-              return 'mermaid';
-            }
+                  if (normalizedId.includes('@hyperdx/')) {
+                    return 'rum';
+                  }
 
-            if (normalizedId.includes('@codesandbox/sandpack')) {
-              return 'sandpack';
-            }
-            if (normalizedId.includes('react-vtree')) {
-              return 'react-vtree';
-            }
-            if (normalizedId.includes('react-virtualized')) {
-              return 'virtualization';
-            }
-            if (normalizedId.includes('i18next') || normalizedId.includes('react-i18next')) {
-              return 'i18n';
-            }
-            // Only regular lodash (not lodash-es which goes to mermaid chunk)
-            if (normalizedId.includes('/lodash/')) {
-              return 'utilities';
-            }
-            if (normalizedId.includes('date-fns')) {
-              return 'date-utils';
-            }
-            if (normalizedId.includes('@dicebear')) {
-              return 'avatars';
-            }
-            if (
-              normalizedId.includes('react-dnd') ||
-              normalizedId.includes('dnd-core') ||
-              normalizedId.includes('react-flip-toolkit') ||
-              normalizedId.includes('flip-toolkit')
-            ) {
-              return 'react-interactions';
-            }
-            if (normalizedId.includes('react-hook-form')) {
-              return 'forms';
-            }
-            if (normalizedId.includes('react-router-dom')) {
-              return 'routing';
-            }
-            if (
-              normalizedId.includes('qrcode.react') ||
-              normalizedId.includes('@marsidev/react-turnstile')
-            ) {
-              return 'security-ui';
-            }
+                  // IMPORTANT: mermaid and ALL its dependencies must be in the same chunk
+                  // to avoid initialization order issues. This includes chevrotain, langium,
+                  // dagre-d3-es, and their nested lodash-es dependencies.
+                  if (
+                    normalizedId.includes('mermaid') ||
+                    normalizedId.includes('dagre-d3-es') ||
+                    normalizedId.includes('chevrotain') ||
+                    normalizedId.includes('langium') ||
+                    normalizedId.includes('lodash-es')
+                  ) {
+                    return 'mermaid';
+                  }
 
-            if (normalizedId.includes('@codemirror/view')) {
-              return 'codemirror-view';
-            }
-            if (normalizedId.includes('@codemirror/state')) {
-              return 'codemirror-state';
-            }
-            if (normalizedId.includes('@codemirror/language')) {
-              return 'codemirror-language';
-            }
-            if (normalizedId.includes('@codemirror')) {
-              return 'codemirror-core';
-            }
+                  if (normalizedId.includes('@codesandbox/sandpack')) {
+                    return 'sandpack';
+                  }
+                  if (normalizedId.includes('react-vtree')) {
+                    return 'react-vtree';
+                  }
+                  if (normalizedId.includes('react-virtualized')) {
+                    return 'virtualization';
+                  }
+                  if (normalizedId.includes('i18next') || normalizedId.includes('react-i18next')) {
+                    return 'i18n';
+                  }
+                  // Only regular lodash (not lodash-es which goes to mermaid chunk)
+                  if (normalizedId.includes('/lodash/')) {
+                    return 'utilities';
+                  }
+                  if (normalizedId.includes('date-fns')) {
+                    return 'date-utils';
+                  }
+                  if (normalizedId.includes('@dicebear')) {
+                    return 'avatars';
+                  }
+                  if (
+                    normalizedId.includes('react-dnd') ||
+                    normalizedId.includes('dnd-core') ||
+                    normalizedId.includes('react-flip-toolkit') ||
+                    normalizedId.includes('flip-toolkit')
+                  ) {
+                    return 'react-interactions';
+                  }
+                  if (normalizedId.includes('react-hook-form')) {
+                    return 'forms';
+                  }
+                  if (normalizedId.includes('react-router-dom')) {
+                    return 'routing';
+                  }
+                  if (
+                    normalizedId.includes('qrcode.react') ||
+                    normalizedId.includes('@marsidev/react-turnstile')
+                  ) {
+                    return 'security-ui';
+                  }
 
-            if (
-              normalizedId.includes('react-markdown') ||
-              normalizedId.includes('remark-') ||
-              normalizedId.includes('rehype-')
-            ) {
-              return 'markdown-processing';
-            }
-            if (normalizedId.includes('monaco-editor') || normalizedId.includes('@monaco-editor')) {
-              return 'code-editor';
-            }
-            if (normalizedId.includes('react-window') || normalizedId.includes('react-virtual')) {
-              return 'virtualization';
-            }
-            if (
-              normalizedId.includes('zod') ||
-              normalizedId.includes('yup') ||
-              normalizedId.includes('joi')
-            ) {
-              return 'validation';
-            }
-            if (
-              normalizedId.includes('axios') ||
-              normalizedId.includes('ky') ||
-              normalizedId.includes('fetch')
-            ) {
-              return 'http-client';
-            }
-            if (
-              normalizedId.includes('react-spring') ||
-              normalizedId.includes('react-transition-group')
-            ) {
-              return 'animations';
-            }
-            if (normalizedId.includes('react-select') || normalizedId.includes('downshift')) {
-              return 'advanced-inputs';
-            }
-            if (normalizedId.includes('heic-to')) {
-              return 'heic-converter';
-            }
+                  if (normalizedId.includes('@codemirror/view')) {
+                    return 'codemirror-view';
+                  }
+                  if (normalizedId.includes('@codemirror/state')) {
+                    return 'codemirror-state';
+                  }
+                  if (normalizedId.includes('@codemirror/language')) {
+                    return 'codemirror-language';
+                  }
+                  if (normalizedId.includes('@codemirror')) {
+                    return 'codemirror-core';
+                  }
 
-            // Existing chunks
-            if (normalizedId.includes('@radix-ui')) {
-              return 'radix-ui';
-            }
-            if (normalizedId.includes('framer-motion')) {
-              return 'framer-motion';
-            }
-            if (
-              normalizedId.includes('node_modules/highlight.js') ||
-              normalizedId.includes('node_modules/lowlight')
-            ) {
-              return 'markdown_highlight';
-            }
-            if (normalizedId.includes('katex') || normalizedId.includes('node_modules/katex')) {
-              return 'math-katex';
-            }
-            if (normalizedId.includes('node_modules/hast-util-raw')) {
-              return 'markdown_large';
-            }
-            if (normalizedId.includes('@tanstack')) {
-              return 'tanstack-vendor';
-            }
-            if (normalizedId.includes('@headlessui')) {
-              return 'headlessui';
-            }
+                  if (
+                    normalizedId.includes('react-markdown') ||
+                    normalizedId.includes('remark-') ||
+                    normalizedId.includes('rehype-')
+                  ) {
+                    return 'markdown-processing';
+                  }
+                  if (
+                    normalizedId.includes('monaco-editor') ||
+                    normalizedId.includes('@monaco-editor')
+                  ) {
+                    return 'code-editor';
+                  }
+                  if (
+                    normalizedId.includes('react-window') ||
+                    normalizedId.includes('react-virtual')
+                  ) {
+                    return 'virtualization';
+                  }
+                  if (
+                    normalizedId.includes('zod') ||
+                    normalizedId.includes('yup') ||
+                    normalizedId.includes('joi')
+                  ) {
+                    return 'validation';
+                  }
+                  if (
+                    normalizedId.includes('axios') ||
+                    normalizedId.includes('ky') ||
+                    normalizedId.includes('fetch')
+                  ) {
+                    return 'http-client';
+                  }
+                  if (
+                    normalizedId.includes('react-spring') ||
+                    normalizedId.includes('react-transition-group')
+                  ) {
+                    return 'animations';
+                  }
+                  if (normalizedId.includes('react-select') || normalizedId.includes('downshift')) {
+                    return 'advanced-inputs';
+                  }
+                  if (normalizedId.includes('heic-to')) {
+                    return 'heic-converter';
+                  }
 
-            if (normalizedId.includes('@icons-pack/react-simple-icons/icons/')) {
-              return;
-            }
+                  // Existing chunks
+                  if (normalizedId.includes('@radix-ui')) {
+                    return 'radix-ui';
+                  }
+                  if (normalizedId.includes('framer-motion')) {
+                    return 'framer-motion';
+                  }
+                  if (
+                    normalizedId.includes('node_modules/highlight.js') ||
+                    normalizedId.includes('node_modules/lowlight')
+                  ) {
+                    return 'markdown_highlight';
+                  }
+                  if (
+                    normalizedId.includes('katex') ||
+                    normalizedId.includes('node_modules/katex')
+                  ) {
+                    return 'math-katex';
+                  }
+                  if (normalizedId.includes('node_modules/hast-util-raw')) {
+                    return 'markdown_large';
+                  }
+                  if (normalizedId.includes('@tanstack')) {
+                    return 'tanstack-vendor';
+                  }
+                  if (normalizedId.includes('@headlessui')) {
+                    return 'headlessui';
+                  }
 
-            // Everything else falls into a generic vendor chunk.
-            return 'vendor';
-          }
-          // Create a separate chunk for all locale files under src/locales.
-          if (normalizedId.includes('/src/locales/')) {
-            return 'locales';
-          }
-          // Let Rollup decide automatically for any other files.
-          return null;
+                  if (normalizedId.includes('@icons-pack/react-simple-icons/icons/')) {
+                    return null;
+                  }
+
+                  // Everything else falls into a generic vendor chunk.
+                  return 'vendor';
+                }
+                if (normalizedId.includes('/src/polyfills/')) {
+                  return 'polyfills';
+                }
+                // Create a separate chunk for all locale files under src/locales.
+                if (normalizedId.includes('/src/locales/')) {
+                  return 'locales';
+                }
+                // Let Rolldown decide automatically for any other files.
+                return null;
+              },
+            },
+          ],
         },
         entryFileNames: 'assets/[name].[hash].js',
         chunkFileNames: 'assets/[name].[hash].js',