33 lines
1.6 KiB
Plaintext
33 lines
1.6 KiB
Plaintext
|
---
|
||
|
|
title: Vista previa y servidores de desarrollo
|
||
|
|
description: Abre un servidor de desarrollo en marcha dentro de OpenChamber.
|
||
|
|
---
|
||
|
|
|
||
|
|
# Vista previa y servidores de desarrollo
|
||
|
|
|
||
|
|
Cuando inicias un servidor de desarrollo, OpenChamber puede abrirlo dentro de la propia app en lugar de en una pestaña de navegador aparte, para que veas tu sitio junto al chat, captures su consola y señales elementos para preguntar sobre ellos.
|
||
|
|
|
||
|
|
## Abre una vista previa
|
||
|
|
|
||
|
|
OpenChamber observa la salida de la terminal en busca de una dirección local (la línea `Local:` que imprimen herramientas como Vite, Next.js o Astro). Cuando detecta una:
|
||
|
|
|
||
|
|
- en la terminal aparece un botón **Open preview**
|
||
|
|
- una [acción de proyecto](/es/project-actions/) con la apertura automática activada la abre por ti
|
||
|
|
- un enlace local en un mensaje del chat también puede abrirla
|
||
|
|
|
||
|
|
El sitio se carga en el panel lateral. Solo se pueden previsualizar direcciones locales (en tu propia máquina).
|
||
|
|
|
||
|
|
## Consola e inspección
|
||
|
|
|
||
|
|
En el panel de vista previa puedes:
|
||
|
|
|
||
|
|
- ver la **consola** de la página —errores, advertencias y registros— filtrada como prefieras
|
||
|
|
- activar **inspect**, hacer clic en cualquier elemento y enviar una nota sobre él —selector, estilos, posición y una captura de pantalla— directamente al chat
|
||
|
|
|
||
|
|
Esta es la forma más rápida de decirle al agente "este botón, aquí" sin describirlo.
|
||
|
|
|
||
|
|
## Relacionado
|
||
|
|
|
||
|
|
- [Acciones de proyecto](/es/project-actions/) — abre automáticamente un servidor al iniciarlo
|
||
|
|
- [Navegador de escritorio](/es/desktop-browser/) — las mismas herramientas para cualquier página, en el escritorio
|