fix: optimizar React en Vite y documentar solución para Vercel

- Añadir optimizeDeps con React explícito
- Mejorar condiciones de resolución
- Documentar solución para vendor-other en Vercel
- El build local es correcto, el problema es caché/build antiguo en Vercel
This commit is contained in:
planetazuzu 2026-01-02 15:34:23 +01:00
parent 7c05276d41
commit 3f0478b506

View file

@ -0,0 +1,121 @@
# 🔧 Solución: vendor-other en Vercel
## ❌ Error en Vercel
```
vendor-other-BAwUH002.js:10 Uncaught TypeError: Cannot read properties of undefined (reading 'useLayoutEffect')
```
## ✅ Diagnóstico
### Build Local (CORRECTO)
El build local **NO genera** `vendor-other`:
- ✅ `vendor-react-BS48V2Wz.js` (1,081 KB)
- ✅ `vendor-utils-CsrMcf8K.js` (451 KB)
- ✅ `vendor-markdown-DL9wdAk1.js` (114 KB)
- ❌ `vendor-other` **NO EXISTE**
### Build en Vercel (PROBLEMA)
Vercel está sirviendo `vendor-other-BAwUH002.js`, lo que indica:
1. **Build antiguo** en Vercel (antes de nuestros cambios)
2. **Caché** en Vercel que no se ha limpiado
3. **Deploy** no actualizado con el código más reciente
## 🔧 Soluciones
### Solución 1: Forzar Redeploy en Vercel
1. **Ve al Dashboard de Vercel:**
- https://vercel.com/dashboard
- Selecciona tu proyecto
2. **Ve a Deployments:**
- Click en el último deployment
- Click en **"Redeploy"**
- O crea un nuevo deployment desde el branch `main`
3. **Verificar:**
- Espera a que termine el build
- Verifica que el nuevo build NO tiene `vendor-other`
### Solución 2: Limpiar Build Cache en Vercel
1. **Vercel Dashboard:**
- Settings > **Build & Development Settings**
- Scroll hasta **"Build Cache"**
- Click en **"Clear Build Cache"**
2. **Hacer nuevo deploy:**
- Push un commit nuevo, o
- Redeploy desde el dashboard
### Solución 3: Verificar Configuración de Vercel
1. **Verificar branch conectado:**
- Settings > **Git**
- Verifica que está conectado a `main`
- Verifica que el último commit está desplegado
2. **Verificar build command:**
- Settings > **Build & Development Settings**
- Build Command: `npm run build`
- Output Directory: `dist`
3. **Verificar variables de entorno:**
- Settings > **Environment Variables**
- No debería haber variables que afecten el build
### Solución 4: Forzar Nuevo Build
```bash
# Desde tu máquina local
git commit --allow-empty -m "chore: forzar redeploy en Vercel"
git push origin main
```
Esto trigger un nuevo build en Vercel automáticamente.
## 🧪 Verificación
Después del redeploy, verifica:
1. **En Vercel Dashboard:**
- Ve al deployment más reciente
- Click en "View Function Logs" o "View Build Logs"
- Busca en los logs: `vendor-other`
- **NO debería aparecer**
2. **En el navegador:**
- Abre DevTools (F12)
- Ve a **Network** tab
- Recarga la página
- Busca archivos `vendor-other`
- **NO debería haber ninguno**
3. **En la consola:**
- No debería aparecer el error de `useLayoutEffect`
- Si aparece, el caché del navegador no se limpió
## 📋 Checklist
- [ ] Build local verificado (no genera vendor-other)
- [ ] Código más reciente en GitHub
- [ ] Vercel conectado al branch correcto
- [ ] Build cache limpiado en Vercel
- [ ] Nuevo deploy realizado
- [ ] Verificado que el nuevo build no tiene vendor-other
- [ ] Caché del navegador limpiado
- [ ] Error resuelto
## 💡 Nota sobre Errores 401
Los errores `401` en `manifest.json` son un problema separado de Vercel:
- Puede ser configuración de autenticación
- O problema de permisos en Vercel
- No afecta el funcionamiento de la app, solo el manifest
## 🎯 Resumen
**El código está correcto.** El problema es que **Vercel está usando un build antiguo**.
**Solución:** Forzar un nuevo deploy en Vercel después de limpiar el build cache.