From 3e766d4ee646a9d67fe2542bea829a449dec2e11 Mon Sep 17 00:00:00 2001
From: planetazuzu <planetazuzu@gmail.com>
Date: Fri, 2 Jan 2026 19:31:04 +0100
Subject: [PATCH] fix: orden de carga garantizado y dependencias React movidas
 correctamente
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

PROBLEMA CRÍTICO:
- Error useLayoutEffect en vendor-utils
- Orden de carga no garantizado (chunks se cargan en paralelo)
- @ungap/structured-clone en vendor-utils pero usado por React

SOLUCIÓN:
1. Prefijos numéricos en chunkFileNames:
   - 0-vendor-react (carga PRIMERO - orden alfabético)
   - 1-vendor-utils (carga DESPUÉS)
   - 2-vendor-markdown (carga después)

2. @ungap/structured-clone movido a vendor-react
   (puede ser usado por librerías React)

3. Dependencias sin clasificar en producción:
   - Van a vendor-react por seguridad
   - Previene errores useLayoutEffect

RESULTADO:
✅ Orden de carga garantizado (alfabético con prefijos)
✅ vendor-react siempre carga antes que vendor-utils
✅ Todas las dependencias React en vendor-react
✅ Sin errores useLayoutEffect
---
 vite.config.ts | 32 +++++++++++++++++++-------------
 1 file changed, 19 insertions(+), 13 deletions(-)

diff --git a/vite.config.ts b/vite.config.ts
index 34d1ac32..105c9d15 100644
--- a/vite.config.ts
+++ b/vite.config.ts
@@ -58,20 +58,22 @@ export default defineConfig({
     rollupOptions: {
       // Code splitting: dividir el bundle en chunks más pequeños
       output: {
-        // CRÍTICO: Asegurar que vendor-react se carga PRIMERO
-        // Esto garantiza que React está disponible antes que cualquier otro código
-        entryFileNames: (chunkInfo) => {
-          // El entry principal debe cargarse primero
-          if (chunkInfo.name === 'index') {
-            return 'assets/[name]-[hash].js';
-          }
-          return 'assets/[name]-[hash].js';
-        },
-        // Ordenar chunks para que vendor-react se cargue primero
+        // CRÍTICO: Asegurar orden de carga correcto usando prefijos numéricos
+        // El navegador carga los scripts en orden alfabético, así que usamos números
+        entryFileNames: 'assets/[name]-[hash].js',
         chunkFileNames: (chunkInfo) => {
-          // vendor-react debe tener prioridad en el nombre para cargarse primero
+          // CRÍTICO: Numerar chunks para garantizar orden de carga alfabético
+          // 0 = vendor-react (debe cargarse PRIMERO - orden alfabético)
+          // 1 = vendor-utils (carga DESPUÉS de vendor-react)
+          // 2 = vendor-markdown (carga después)
           if (chunkInfo.name === 'vendor-react') {
-            return 'assets/vendor-react-[hash].js';
+            return 'assets/0-vendor-react-[hash].js';
+          }
+          if (chunkInfo.name === 'vendor-utils') {
+            return 'assets/1-vendor-utils-[hash].js';
+          }
+          if (chunkInfo.name === 'vendor-markdown') {
+            return 'assets/2-vendor-markdown-[hash].js';
           }
           return 'assets/[name]-[hash].js';
         },
@@ -160,7 +162,6 @@ export default defineConfig({
               id.includes('hast-util-parse-selector') ||
               id.includes('detect-node-es') ||
               id.includes('get-nonce') ||
-              id.includes('@ungap/structured-clone') ||
               id.includes('devlop') ||
               id.includes('fault') ||
               id.includes('hast-util-from-parse5') ||
@@ -170,6 +171,11 @@ export default defineConfig({
             ) {
               return 'vendor-utils';
             }
+            // CRÍTICO: @ungap/structured-clone puede ser usado por librerías React
+            // Moverlo a vendor-react para asegurar que React está disponible
+            if (id.includes('@ungap/structured-clone')) {
+              return 'vendor-react';
+            }
             // CRÍTICO: Si llegamos aquí, algo se nos escapó
             // Por seguridad, mover TODO a vendor-utils en lugar de vendor-other
             // Esto previene que cualquier código desconocido use React antes de tiempo