Editor de código

El Editor de código es para texto que un editor de texto enriquecido arruinaría: HTML, CSS, JavaScript, TypeScript, JSON, Markdown.

Usa el motor Monaco — el mismo que hay detrás de VS Code — así que tienes resaltado de sintaxis, emparejamiento de llaves y funciones de lenguaje reales, no un textarea coloreado.

Ábrelo

Doble clic en una tarjeta de documento que contenga código o HTML.

O abre Extensiones → Editor de código y usa Nuevo documento HTML para empezar de cero.

Tres formas de mirarlo

Un control de modo de vista cambia entre:

Código — solo el editor. Para trabajo concentrado.

Dividido — código a un lado, vista previa en vivo al otro. La vista previa sigue tus ediciones, que es lo que quieres para HTML que estás dando forma.

Vista previa — solo el resultado renderizado. Para comprobar, o para enseñárselo a alguien.

Guardado

Guardar escribe de vuelta en la tarjeta. El botón informa Guardado para que sepas que llegó.

Guardar como escribe un documento nuevo, dejando el original como estaba.

Tu HTML no se sanea

Esto importa y es fácil pasarlo por alto.

El Editor de código trata tu HTML como crudo: lo que escribes es lo que se guarda y se renderiza en la vista previa. No se recorta, reescribe ni limpia por ti.

Es el comportamiento correcto para un editor de código. Una herramienta que quitara en silencio tu etiqueta <script> o reescribiera tu marcado sería inútil para el trabajo. Pero sí significa que la vista previa ejecuta lo que escribiste, así que trata el código pegado de otro sitio con la misma cautela que en cualquier otra parte.

Conviene saber

Los archivos de tu ordenador son de solo lectura. Abierto a través del panel de archivos, un archivo no se puede sobrescribir: usa Guardar una copia.

Siguiente

• Documentos — para prosa en lugar de marcado
• Herramientas — la tarjeta de código, para fragmentos cortos en el espacio de trabajo