El Editor de Código en el Estudio de IA te da acceso directo al código de tu proyecto sin salir del constructor. Puedes editar archivos, buscar en todo el proyecto, detectar problemas rápidamente y revisar cambios en tiempo real desde un solo espacio de trabajo.

Es un entorno de programación integrado dentro del constructor del Estudio de IA. Te permite ver, editar y gestionar el código detrás de tus sitios web y aplicaciones generadas por IA directamente en CRMHUB, sin necesidad de un IDE externo ni un paso de despliegue. El Estudio de IA genera un proyecto funcional a partir de tus indicaciones (idea, URL, o diseño de referencia), y el Editor de Código te da control preciso sobre los archivos TypeScript, JSX, CSS, JSON y otros que dan vida a esa experiencia.

Con el Editor de Código puedes iterar donde construyes: editar código, ver actualizaciones instantáneas en la vista previa en vivo, y usar IA para diagnosticar y corregir errores sobre la marcha.

Te ayuda a localizar y actualizar texto rápidamente dentro del archivo actual. Útil para renombrar componentes, actualizar texto fijo, o refactorizar nombres de variables de forma consistente.

Te permite buscar en todo tu proyecto, no solo en el archivo abierto. Incluye resultados agrupados por archivo, coincidencias resaltadas, números de línea, y navegación de un clic directo al archivo y línea correspondiente.

Revisa los cambios rápidamente mientras trabajas. En vez de confirmar cambios y esperar un paso de despliegue separado, actualizas el código y ves el efecto de inmediato en la vista previa del constructor. Solo haz clic en Guardar y la vista previa se actualiza en segundos.

Detecta problemas de compilación rápidamente mientras trabajas en el Editor de Código.

Paso 1: Después de guardar cambios de código, puede aparecer un error en el chat como "Código editado" con "Compilación fallida" debajo. Haz clic en Detalles para revisar el error de compilación, luego en Intentar corregir para que la IA analice el problema e intente una solución.

Paso 2: La IA identificará el error, actualizará el código, y publicará un mensaje de seguimiento explicando qué se corrigió. Haz clic en Detalles para revisar la información actualizada, o en Vista Previa para refrescar y confirmar que la corrección funcionó.

Mantiene organizada la estructura de tu proyecto cuando agregas nuevas rutas en código. Cuando se crea una nueva ruta en el código, aparece automáticamente en el selector de rutas.

Te da un flujo de edición más seguro al conservar estados anteriores de tu proyecto. Cada vez que guardas tu código, se crea una versión nueva. Haz clic en el ícono de reloj en la parte superior del constructor para acceder al historial.

El Estudio de IA te advierte antes de salir con cambios de código sin guardar, para ayudarte a evitar perder trabajo.

Paso 1: Abre el proyecto del Estudio de IA que quieres actualizar. En el espacio de trabajo del proyecto, haz clic en Código para acceder al Editor de Código.

Paso 2: Abre el archivo que quieres editar desde el árbol de archivos, y haz tus cambios directamente en el editor. Usa Buscar y Reemplazar o Búsqueda Global del Proyecto si necesitas ayuda para ubicar el contenido o archivo correcto.

Paso 3: Haz clic en Guardar para aplicar tus actualizaciones y refrescar la vista previa más reciente.

Paso 4: Revisa la vista previa para confirmar que el contenido, diseño y funcionalidad se ven como esperabas. Si aparece un error de compilación después de guardar, haz clic en Detalles para revisar el problema, luego en Intentar corregir para que la IA intente una corrección.

Paso 5: Una vez que tus cambios se vean correctos y tu proyecto esté listo, publica el proyecto para que las actualizaciones queden en vivo.