Gerador de mapa de origem

• Geração do mapa de origem v3: gere arquivos padrão do mapa de origem v3 a partir de seu código JavaScript original e reduzido. Produz mapeamentos codificados em VLQ válidos, referências de arquivo de origem, matriz de nomes e sourceContent opcional para reconstrução completa da origem. Compatível com navegadores, empacotadores e ferramentas de depuração.
• Processamento 100% local no navegador: toda a geração do mapa de origem acontece inteiramente no seu navegador. Seu código-fonte original e JavaScript reduzido nunca saem do seu dispositivo. Não há uploads para nenhum servidor, não é necessária inscrição e não há limites de uso. Completamente grátis para sempre.
• Visualização detalhada do mapeamento: visualize uma tabela de mapeamento completa mostrando cada posição gerada e seu arquivo, linha e coluna original correspondente. Explore o JSON do mapa de origem bruto, inspecione os segmentos VLQ decodificados e verifique a precisão do mapeamento antes de fazer download ou copiar.
• Geração instantânea com estatísticas: os mapas de origem são gerados em tempo real conforme você digita ou cola o código. Veja imediatamente quantos mapeamentos foram criados, o tamanho do arquivo do mapa de origem, a taxa de compactação e o número de arquivos de origem e identificadores nomeados. Copie ou baixe o arquivo .map gerado com um clique.

• Depurando código de produção ofuscado: gere mapas de origem para seus pacotes JavaScript ofuscados para que você possa depurar problemas de produção com nomes de variáveis ​​originais, estrutura de arquivos e comentários. Conecte o mapa de origem à sua ferramenta de monitoramento de erros (Sentry, Datadog, New Relic) para obter rastreamentos de pilha legíveis de erros de produção reduzidos.
• Integração de pipeline de ofuscação: ao aplicar ofuscação JS (renomeação de variáveis, codificação de string, nivelamento de fluxo de controle) como parte de seu pipeline de construção, gere mapas de origem que mapeiem a saída ofuscada de volta ao código pré-ofuscado. Isso permite a depuração com código legível enquanto envia JavaScript protegido.
• Depuração do DevTools do navegador: Anexe mapas de origem gerados aos pacotes JavaScript implantados para que o Chrome DevTools, o Firefox Developer Tools e o Safari Web Inspector possam exibir o código-fonte original no painel Fontes. Defina pontos de interrupção, inspecione variáveis ​​e percorra seu código original mesmo quando o navegador estiver executando JavaScript reduzido.
• Artefatos de mapa de origem de CI/CD: gere mapas de origem durante seu pipeline de CI/CD e carregue-os em seu serviço de rastreamento de erros sem expô-los aos usuários finais. A ferramenta ajuda você a entender o formato do mapa de origem e a testar seu pipeline de geração antes da integração com suas ferramentas de construção.
• Source Map Format Educação e Pesquisa: Entenda como o Source Map v3 funciona vendo mapeamentos codificados em VLQ gerados em tempo real a partir de seu próprio código. A ferramenta é excelente para aprender sobre o formato do mapa de origem, codificação VLQ, mapeamentos de linha/coluna e como nomes e fontes são referenciados.
• Desofuscação manual do rastreamento de pilha: se você tiver um rastreamento de pilha de produção ofuscado/minificado, mas perdeu seus mapas de origem, reconstrua manualmente o mapeamento colando seu código original e reduzido. O mapa de origem gerado pode ser usado com o Source Map Unminifier para recuperar as posições exatas do código original.

Um mapa de origem é um arquivo que mapeia o código transformado, reduzido ou ofuscado de volta à sua fonte original. O formato Source Map v3 usa codificação Base64-VLQ (Variable Length Quantity) para armazenar mapeamentos de posição de forma compacta. Cada mapeamento registra a linha/coluna gerada e seu arquivo, linha e coluna originais correspondentes, além de um nome de identificador opcional. Quando um navegador ou depurador carrega um mapa de origem junto com o código reduzido, ele pode exibir o código-fonte original com nomes de variáveis, organização de arquivos e comentários corretos – tornando viável a depuração do código de produção.

1. Insira o código original: cole seu código-fonte JavaScript legível e original no painel esquerdo. Esta é a versão de pré-minificação/pré-ofuscação da qual você deseja mapear.
2. Insira o código minificado/ofuscado: cole seu código JavaScript minificado ou ofuscado no painel direito. O gerador comparará cada posição de linha e caractere para criar mapeamentos precisos entre as duas versões.
3. Geração do mapa de origem: a ferramenta gera um arquivo JSON do mapa de origem v3 válido contendo mapeamentos codificados em VLQ, uma lista de arquivos de origem, uma matriz de nomes para identificadores e, opcionalmente, o conteúdo de origem original completo (sourcesContent) para reconstrução completa. Você pode copiar o JSON ou baixá-lo como um arquivo .map.

• Versão: O formato do mapa de origem está atualmente na versão 3, definida pela Especificação do Mapa de Origem. O campo de versão é sempre 3 .
• Mapeamentos: o campo de mapeamentos contém strings codificadas em VLQ separadas por ponto e vírgula (para quebras de linha) e vírgulas (para segmentos individuais dentro de uma linha). Cada segmento codifica até 5 valores: coluna gerada, índice de origem, linha original, coluna original e índice de nome — todos armazenados como deslocamentos relativos para compactação ideal.
• Fontes: uma matriz de caminhos de arquivos de origem originais referenciados por índice nos mapeamentos. Você pode especificar nomes de arquivos de origem personalizados para a estrutura do seu projeto.
• Nomes: Uma matriz de nomes de identificadores (nomes de variáveis, nomes de funções, etc.) que aparecem no código original e gerado, referenciados por índice nos mapeamentos.
• sourceContent: uma matriz opcional que contém o código-fonte original completo para cada arquivo-fonte. Quando presentes, os depuradores podem exibir o código original exato sem precisar acessar os arquivos originais no disco.
• Codificação VLQ: Base64-VLQ é uma codificação compacta de comprimento variável em que cada caractere representa 6 bits (0-63). O bit de continuação (bit 6) sinaliza se mais caracteres seguem para o mesmo valor. O sinal é codificado como o bit menos significativo (1 = negativo, 0 = positivo), permitindo deslocamentos negativos em mapeamentos relativos.

Seu código JavaScript é processado inteiramente em seu navegador. Nenhum código é carregado em qualquer servidor, armazenado, registrado ou compartilhado com terceiros. A ferramenta não requer criação de conta, inscrição e não impõe limites de tamanho de código. É totalmente gratuito, sem níveis premium, limites de uso ou cobranças ocultas. Você pode usá-lo quantas vezes for necessário para gerar mapas de origem, depuração ou para fins educacionais.