Generador de mapas fuente

• Generación de Source Map v3: genere archivos estándar de Source Map v3 a partir de su código JavaScript original y minimizado. Produce asignaciones válidas codificadas en VLQ, referencias de archivos fuente, matrices de nombres y contenido de fuentes opcional para una reconstrucción completa del código fuente. Compatible con navegadores, paquetes y herramientas de depuración.
• Procesamiento 100 % local en el navegador: toda la generación de mapas de origen se realiza completamente en su navegador. Su código fuente original y JavaScript minimizado nunca abandonan su dispositivo. No hay cargas a ningún servidor, no es necesario registrarse y no hay límites de uso. Completamente gratis para siempre.
• Vista previa de mapeo detallado: vea una tabla de mapeo completa que muestra cada posición generada y su archivo, línea y columna original correspondiente. Explore el JSON del mapa de origen sin formato, inspeccione los segmentos VLQ decodificados y verifique la precisión del mapeo antes de descargarlo o copiarlo.
• Generación instantánea con estadísticas: los mapas fuente se generan en tiempo real a medida que escribe o pega código. Vea inmediatamente cuántas asignaciones se crearon, el tamaño del archivo de mapa de origen, la relación de compresión y la cantidad de archivos de origen e identificadores con nombre. Copie o descargue el archivo .map generado con un solo clic.

• Depuración de código de producción ofuscado: genere mapas fuente para sus paquetes de JavaScript ofuscados para que pueda depurar problemas de producción con nombres de variables, estructura de archivos y comentarios originales. Conecte el mapa fuente a su herramienta de monitoreo de errores (Sentry, Datadog, New Relic) para obtener seguimientos de pila legibles de errores de producción minimizados.
• Integración de la canalización de ofuscación: al aplicar la ofuscación JS (cambio de nombre de variables, codificación de cadenas, aplanamiento del flujo de control) como parte de su canalización de compilación, genere mapas de origen que asigne la salida ofuscada al código previamente ofuscado. Esto permite la depuración con código legible mientras se envía JavaScript protegido.
• Depuración de DevTools del navegador: adjunte mapas fuente generados a sus paquetes de JavaScript implementados para que Chrome DevTools, Firefox Developer Tools y Safari Web Inspector puedan mostrar el código fuente original en el panel Fuentes. Establezca puntos de interrupción, inspeccione variables y revise su código original incluso cuando el navegador ejecute JavaScript minimizado.
• Artefactos de mapas de origen de CI/CD: genere mapas de origen durante su proceso de CI/CD y cárguelos en su servicio de seguimiento de errores sin exponerlos a los usuarios finales. La herramienta le ayuda a comprender el formato del mapa de origen y a probar su canal de generación antes de integrarlo con sus herramientas de compilación.
• Educación e investigación sobre el formato de mapa fuente: comprenda cómo funciona Source Map v3 al ver las asignaciones codificadas en VLQ generadas en tiempo real a partir de su propio código. La herramienta es excelente para aprender sobre el formato del mapa fuente, la codificación VLQ, las asignaciones de líneas/columnas y cómo se hace referencia a los nombres y las fuentes.
• Desofuscación manual del seguimiento de la pila: si tiene un seguimiento de la pila de producción ofuscado/minimizado pero perdió sus mapas de origen, reconstruya manualmente el mapeo pegando su código original y minificado. El mapa fuente generado se puede utilizar con Source Map Unminifier para recuperar las posiciones exactas del código original.

Un mapa fuente es un archivo que asigna código transformado, minimizado u ofuscado a su fuente original. El formato Source Map v3 utiliza codificación Base64-VLQ (Cantidad de longitud variable) para almacenar asignaciones de posición de forma compacta. Cada asignación registra la línea/columna generada y su correspondiente archivo, línea y columna original, además de un nombre de identificador opcional. Cuando un navegador o depurador carga un mapa fuente junto con el código minimizado, puede mostrar el código fuente original con nombres de variables, organización de archivos y comentarios correctos, lo que hace factible la depuración del código de producción.

1. Ingrese el código original: pegue su código fuente JavaScript original y legible en el panel izquierdo. Esta es la versión previa a la minificación/pre-ofuscación desde la que desea realizar el mapeo.
2. Ingrese código minimizado/ofuscado: pegue su código JavaScript minimizado u ofuscado en el panel derecho. El generador comparará cada línea y posición de carácter para crear asignaciones precisas entre las dos versiones.
3. Generación de mapas de origen: la herramienta genera un archivo JSON de mapa de origen v3 válido que contiene asignaciones codificadas en VLQ, una lista de archivos de origen, una matriz de nombres para identificadores y, opcionalmente, el contenido de origen original completo (sourcesContent) para una reconstrucción completa. Puede copiar el JSON o descargarlo como un archivo .map.

• Versión: El formato del mapa fuente se encuentra actualmente en la versión 3, definida por la Especificación del mapa fuente. El campo de versión es siempre 3 .
• Asignaciones: el campo de asignaciones contiene cadenas codificadas en VLQ separadas por punto y coma (para saltos de línea) y comas (para segmentos individuales dentro de una línea). Cada segmento codifica hasta 5 valores: columna generada, índice de origen, línea original, columna original e índice de nombre, todos almacenados como desplazamientos relativos para una compresión óptima.
• Fuentes: una matriz de rutas de archivos fuente originales a las que se hace referencia por índice en las asignaciones. Puede especificar nombres de archivos fuente personalizados para la estructura de su proyecto.
• Nombres: una matriz de nombres de identificadores (nombres de variables, nombres de funciones, etc.) que aparecen tanto en el código original como en el generado, referenciados por índice en las asignaciones.
• fuentesContenido: una matriz opcional que contiene el código fuente original completo para cada archivo fuente. Cuando están presentes, los depuradores pueden mostrar el código original exacto sin necesidad de acceder a los archivos originales en el disco.
• Codificación VLQ: Base64-VLQ es una codificación compacta de longitud variable donde cada carácter representa 6 bits (0-63). El bit de continuación (bit 6) indica si siguen más caracteres para el mismo valor. El signo se codifica como el bit menos significativo (1 = negativo, 0 = positivo), lo que permite compensaciones negativas en asignaciones relativas.

Su código JavaScript se procesa completamente dentro de su navegador. Nunca se carga ningún código en ningún servidor, ni se almacena, registra ni se comparte con terceros. La herramienta no requiere la creación de una cuenta, ni el registro, y no impone límites de tamaño de código. Es completamente gratuito, sin niveles premium, límites de uso ni cargos ocultos. Puede usarlo tantas veces como sea necesario para generar mapas de origen, depuración o con fines educativos.