Ir al contenido
Volver al blog

Cómo alojar fuera de Lovable una app creada con Lovable

Lleva una app de Lovable a tu propio hosting: exporta el código, identifica Vite o TanStack Start, conserva o migra Cloud y prueba antes de cambiar el dominio.

  • Lovable
  • despliegue
  • hosting

Publicar en Lovable y alojar fuera de Lovable son dos cosas distintas. Puedes mover solo la aplicación web y conservar Lovable Cloud, o trasladar también los datos y servicios. Antes de cambiar el dominio, averigua qué parte quieres operar y quién se hará cargo de actualizaciones, copias y seguridad.

La guía oficial de despliegue externo de Lovable documenta ambos recorridos. Esta página resume las decisiones que afectan al alojamiento y propone una secuencia para probar el cambio sin apagar primero la versión que funciona.

1. Saca una copia del código y pruébala en local

Conecta el proyecto a GitHub, GitLab o Bitbucket mediante Git sync de Lovable. El repositorio mantiene sincronizado el código y permite desplegar una rama elegida. Si solo necesitas una copia puntual, Lovable también ofrece la descarga del código según las condiciones de tu plan.

Clona el repositorio, abre package.json y ejecuta la aplicación en tu equipo antes de configurar un servidor. Revisa la rama, el directorio del proyecto y los scripts reales. En un monorepo puede haber varias aplicaciones; el archivo de la raíz no siempre contiene el build que quieres publicar.

2. Averigua si necesitas archivos estáticos o un servidor

Lovable indica que los proyectos nuevos creados desde el 13 de mayo de 2026 usan TanStack Start; los proyectos anteriores de React y Vite siguen funcionando con su arquitectura original. Identifica la tuya en package.json antes de elegir alojamiento.

Las apps antiguas de Lovable hechas con React y Vite generan una salida estática, normalmente en dist/. Se puede servir con un servidor web estático, pero las rutas de navegador necesitan un fallback a index.html. Comprueba que una ruta profunda funciona al abrirla directamente y al recargarla.

TanStack Start puede renderizar rutas en servidor (SSR), preconstruirlas como archivos estáticos (SSG) o combinar modos. La guía externa de Lovable prepara un servidor para TanStack Start; lo necesitas si la app usa SSR en cada petición, funciones de servidor dinámicas o rutas API. Un hosting estático sirve si la configuración genera todas las rutas necesarias y no hace falta un servidor de aplicación en cada petición; el frontend aún puede llamar a un backend externo. Comprueba en package.json si aparecen @tanstack/react-start, nitro, @lovable.dev/vite-tanstack-config y la configuración de build que describe la documentación externa de Lovable.

Para un servidor Node propio, la guía oficial muestra este flujo con Node.js 22 y el preset node-server. Si usas Lovable Cloud, define VITE_SUPABASE_URL y VITE_SUPABASE_PUBLISHABLE_KEY antes del build; configura SUPABASE_URL, SUPABASE_PUBLISHABLE_KEY y los secretos que necesite el servidor en su entorno de ejecución. Las variables VITE_* llegan al navegador: no pongas claves secretas ahí.

# Si el repositorio contiene package-lock.json
npm ci
NITRO_PRESET=node-server npm run build
node .output/server/index.mjs

El build produce el servidor dentro de .output. Sigue los scripts y el lockfile de tu repositorio; si usas otro gestor de paquetes o preset, adapta estos pasos y prueba la salida generada. La asignación NITRO_PRESET=... usa sintaxis de shell POSIX; en PowerShell, establece $env:NITRO_PRESET="node-server" antes de npm run build. No publiques solo dist/ de una app que necesite SSR o funciones servidor.

En Hostbrid, Projects permite desplegar proyectos desde un repositorio y ejecutar servicios Node o Docker. Compara los requisitos de tu app con la configuración y el plan disponibles. Si tu exportación es estática, define el build y el directorio de salida; si es TanStack Start, valida el runtime y la entrada del servidor antes de contratar.

3. Decide qué haces con Lovable Cloud

Mover el frontend no migra automáticamente la base de datos, la autenticación, los archivos, las funciones Edge, las integraciones ni las funciones de IA. Puedes seguir usando Lovable Cloud desde el frontend alojado fuera. En ese caso, mantiene tus datos en el backend actual y el proyecto continúa dependiendo de esos servicios.

Si también quieres dejar Cloud, prepara una migración de datos y servicios por separado. La guía oficial usa Supabase como destino de referencia y explica qué hay que copiar y volver a configurar. Revisa políticas RLS, usuarios, URL de redirección de login, archivos almacenados, funciones y tareas antes de cambiar el frontend. No borres el backend original hasta validar la copia y tener un plan de vuelta.

Las variables VITE_* terminan dentro del JavaScript que recibe el navegador. Trátalas como valores públicos; nunca pongas ahí contraseñas, claves de servicio ni tokens privados. Configura los secretos del servidor en el entorno de ejecución y comprueba los permisos de cada tabla y API.

4. Despliega en una URL temporal y valida los flujos

Configura el build con lo que declare el repositorio. La guía de Lovable muestra npm run build y Node 22 para sus ejemplos actuales, pero confirma el lockfile y el runtime de tu proyecto. Prueba en una URL temporal, sin cambiar aún el DNS de producción.

Abre una ruta interna directamente, recarga, inicia y cierra sesión, envía formularios, sube archivos y ejecuta las funciones que use la app. En TanStack Start, comprueba también una página renderizada en servidor y una función del servidor. Un inicio correcto no demuestra que pagos, autenticación o escritura en base de datos funcionen.

Cuando las pruebas pasen, cambia el dominio y revisa HTTPS, redirecciones de autenticación y llamadas a la API. Conserva la versión anterior durante la comprobación. El botón Publish de Lovable sigue publicando en Lovable; un cambio en la rama Git es lo que puede disparar el despliegue externo, según la integración que hayas configurado.

Para desplegar tu app fuera de Lovable, consulta Projects y sus precios actuales. El alojamiento externo te da control sobre el despliegue, pero también te hace responsable de operar y proteger cada servicio que muevas.

Gestiona tus webs, servidores y correo.

Es gratis y tarda un minuto.

Mínimo 8 caracteres. Ni sólo números ni una contraseña común.

Te mandaremos un correo para confirmar la cuenta.