Edita y corrige un proyecto Build

Antes de empezar

Abre un espacio de trabajo con un proyecto Build y muestra el panel Tu app. Elige Vista previa para revisar la versión seleccionada o Código para editar sus archivos. El panel sigue el nodo Build seleccionado; si eliges un nodo que aún no tiene versión propia, puede mostrar la versión anterior más cercana de esa rama. Comprueba el título de la versión antes de editar.

Las ediciones directas de texto e imagen en la vista previa quedan sin guardar. Los cambios de código también son un borrador hasta que pulses Guardar versión. Guardar crea una versión nueva en un nodo hijo; no actualiza automáticamente un sitio publicado. Puedes usar Descartar para eliminar los cambios manuales que aún no hayas guardado.

Cuándo usar esta función

Usa Editar textos e imágenes para cambiar rápidamente un texto o una imagen sin pedirle nada a un modelo. Elige Código para modificar con precisión HTML, CSS o JavaScript, añadir o borrar un archivo del proyecto o cuando sepas exactamente qué debe cambiar. Usa Editar con IA para seleccionar un elemento y describir el cambio, y Arreglar si la Consola de la vista previa muestra errores. Preguntar sirve para hablar de la app sin tocar los archivos; Construir pide a un modelo que implemente un cambio.

Pasos

1. Selecciona la versión que quieras editar y abre Tu app → Vista previa. Comprueba el título de la versión y su aspecto antes de hacer cambios.
2. Para editar elementos directamente, elige Editar textos e imágenes. Haz clic en un texto compatible, edítalo y pulsa Enter para confirmar. Haz clic en una imagen, introduce su dirección HTTPS y pulsa Cambiar imagen. Los cambios aparecen en la vista previa como un borrador sin guardar.
3. Para pedir a la IA que modifique un elemento, elige Editar con IA, selecciónalo, describe el cambio y pulsa Cambiar con IA. Se prepara una petición Build; revísala en la conversación y espera la versión resultante. Guarda o descarta antes cualquier edición manual.
4. Para editar archivos, elige Código, selecciona una pestaña y modifica el contenido fuente. Usa el control de añadir archivo para crear uno compatible o Borrar archivo para quitar un archivo que no sea el de entrada. La vista previa refleja el borrador mientras trabajas.
5. Vuelve a Vista previa y revisa el diseño en Móvil, Tablet y Escritorio. Pulsa Recargar si necesitas volver a ejecutar la vista actual.
6. Si aparecen errores en la Consola, ábrela y lee los mensajes. Pulsa Arreglar para preparar una petición al modelo con los errores mostrados; después revísala y envíala desde la conversación. Arreglar usa IA y puede gastar créditos.
7. Pulsa Guardar versión para conservar tus cambios manuales en una versión nueva. Elige Descartar para eliminar el borrador y volver a la versión guardada seleccionada. Comprueba la nueva versión en el árbol de conversación antes de seguir.

Ejemplo práctico

Imagina que tu página de aterrizaje funciona, pero el titular es demasiado largo y el menú móvil genera un error en la consola. Usa Editar textos e imágenes para acortar el titular, confirma con Enter y comprueba la vista móvil. Después abre la Consola, lee el error y pulsa Arreglar. La petición de IA es independiente del borrador manual: guarda o descarta primero el cambio del titular. Cuando se genere la reparación, vuelve a probar la vista previa y guarda como versión nueva los cambios de código que hayas hecho directamente.

Qué ocurre después

Al guardar una edición manual, se crea un nodo Build y una versión nuevos; las ramas anteriores se conservan. Selecciona esa versión para seguir editando o elegirla para publicar. Las ediciones con IA y Arreglar generan respuestas de modelo y también aparecen como versiones Build cuando los cambios se aplican correctamente. Ninguna de estas acciones publica por sí sola; consulta Build: publica y exporta cuando quieras compartir el proyecto.

Coste y límites

Los cambios directos de texto e imagen en la vista previa y la edición directa del código no llaman a un modelo. Editar con IA y Arreglar sí lo hacen; el modelo, el contexto y el resultado pueden gastar créditos. Revisa la estimación antes de enviar y el cargo real en la respuesta. Los tipos de archivo, el tamaño del proyecto, el número de archivos y el acceso a modelos premium dependen del plan actual; el panel aplica esos límites. La vista previa se ejecuta en un entorno aislado. Su política puede limitar recursos externos: permite imágenes HTTPS, mientras que los scripts, estilos, fuentes y conexiones dependen de los hosts admitidos que muestra la app. Si algo externo falla, revisa la Consola; no des por hecho que cualquier petición funcionará. Build crea HTML, CSS y JavaScript para el navegador, no un backend alojado.

Solución de problemas

• No puedes seleccionar o guardar un texto en la vista previa: algunos textos se generan dinámicamente o no admiten edición directa. Usa Código o selecciona el elemento con Editar con IA.
• Se rechaza el cambio de imagen: introduce una URL de imagen válida que empiece por https://.
• Ha desaparecido un cambio manual: seguía siendo un borrador sin guardar. Vuelve a la misma versión y pulsa Guardar versión antes de cambiar de versión o salir de la edición.
• Guardar versión muestra un límite de archivos o del proyecto: elimina archivos innecesarios o reduce su tamaño y revisa los límites de tu plan.
• Arreglar no resolvió el error de la Consola: revisa los mensajes más recientes, describe con más precisión lo que aún falla y prueba una petición Build concreta. Comprueba también que la vista previa admita el recurso externo afectado.

Guías relacionadas

• Build
• Build: publica y exporta
• Modelos y créditos
• BYOK