Repolode
Enviar
josdejong

josdejong/jsoneditor

Componente web para ver y editar JSON con modos de árbol, código, texto y vista previa, integrable en tu propia aplicación web.

Ver en GitHub
Estrellas
12,268
Forks
2,073
Issues abiertos
256
Último commit
hace 6 días

¿Qué es?

JSON Editor permite ver, editar, dar formato y validar JSON en el navegador. Ofrece varios modos: un editor de árbol para modificar visualmente campos y valores, un editor de código con resaltado de sintaxis, un editor de texto sin formato y un modo de vista previa para documentos grandes de hasta 500 MiB.

El modo de árbol permite añadir, mover, duplicar y ordenar nodos, aplicar transformaciones basadas en JMESPath, buscar y deshacer o rehacer cambios. En todos los modos ofrece validación de esquemas JSON mediante ajv, además de dar formato, compactar y reparar JSON mal formado.

El editor se distribuye como una biblioteca que puedes integrar en tu propia aplicación web. Se carga como módulo CommonJS, módulo AMD o script estándar, y se puede instalar mediante npm o un CDN.

Funciones clave

  • 01Modo de árbol para editar, mover, duplicar y ordenar campos y valores.
  • 02Modo de código con resaltado de sintaxis, formato y compactación.
  • 03Modo de vista previa para manejar documentos JSON de hasta 500 MiB.
  • 04Validación de esquemas JSON con ajv en todos los modos.
  • 05Consultas JMESPath para transformar datos JSON.
  • 06Reparación de JSON mal formado.

Casos de uso

  • Integrar un editor JSON en un panel de administración web o una herramienta de configuración.
  • Inspeccionar y corregir respuestas de API o archivos de configuración en el navegador.
  • Validar JSON con un esquema antes de guardar datos enviados por usuarios.
  • Ver archivos JSON grandes con el modo de vista previa.

Inicio rápido

  1. 1

    Instala la biblioteca con npm

    npm install jsoneditor
  2. 2

    Incluye los archivos CSS y JS en tu página HTML y crea un editor dentro de un elemento contenedor

Antes de usarlo

  • El README indica que svelte-jsoneditor es el sucesor y que el nuevo editor no es un reemplazo idéntico.

Temas

#json#editor#json-schema#web-component#tree-view#validation

Preguntas frecuentes

¿Qué es jsoneditor?
Componente web para ver y editar JSON con modos de árbol, código, texto y vista previa, integrable en tu propia aplicación web. JSON Editor permite ver, editar, dar formato y validar JSON en el navegador. Ofrece varios modos: un editor de árbol para modificar visualmente campos y valores, un editor de código con resaltado de sintaxis, un editor de texto sin formato y un modo de vista previa para documentos grandes de hasta 500 MiB.
¿jsoneditor es gratuito? ¿Qué licencia tiene?
jsoneditor es open source bajo la licencia Apache-2.0. Revisa los términos de la licencia antes de usarlo en productos comerciales.
¿jsoneditor sigue mantenido?
Mantenimiento activo. El último commit de jsoneditor fue el 1 nov 2026.
¿Para qué puedo usar jsoneditor?
Integrar un editor JSON en un panel de administración web o una herramienta de configuración. Inspeccionar y corregir respuestas de API o archivos de configuración en el navegador. Validar JSON con un esquema antes de guardar datos enviados por usuarios. Ver archivos JSON grandes con el modo de vista previa.
¿Cómo se instala jsoneditor?
Instala la biblioteca con npm: npm install jsoneditor Incluye los archivos CSS y JS en tu página HTML y crea un editor dentro de un elemento contenedor
¿Dónde consigo jsoneditor?
El código fuente y las instrucciones de instalación están en GitHub: https://github.com/josdejong/jsoneditor

Resumen generado por IA a partir del README del proyecto. Las estadísticas de GitHub se actualizan a diario.

Proyectos relacionados