Pembaca Peta Sumber JavaScript
Dekode pemetaan Base64 VLQ file .map untuk menemukan sumber asli, baris dan kolom di balik posisi termampatkan, jelajahi tabel pemetaan lengkap dari yang dihasilkan ke asli, atau batalkan pemetaan jejak tumpukan termampatkan kembali ke sumber Anda.
Input
Konten file .map, atau JSON yang didekode dari data: URI //# sourceMappingURL= inline.
Berbasis-1, seperti yang ditampilkan di editor kode atau jejak tumpukan browser — karakter pertama di baris adalah kolom 1.
Output
Panduan
Ketika bundler memampatkan JavaScript Anda, ia menghasilkan file .map di sampingnya — sebuah dokumen JSON yang memetakan setiap posisi dalam keluaran termampatkan kembali ke baris dan kolom dalam sumber asli Anda. Membaca pemetaan itu dengan tangan berarti mendekode segmen Base64 VLQ (Variable-Length Quantity) yang dikemas dalam field mappings peta, yang persis seperti pekerjaan biner dan algoritmik yang dilakukan alat ini untuk Anda.
Cara menggunakannya
Tempel konten file .map (atau unggah langsung) ke field peta sumber, kemudian pilih mode:
- Cari posisi — masukkan baris dan kolom termampatkan (seperti yang ditampilkan di DevTools browser atau penampil kode termampatkan) untuk mendapatkan file asli, baris, kolom dan cuplikan sumber sekitarnya.
- Tabel pemetaan lengkap — lihat setiap pemetaan dari yang dihasilkan ke asli yang berisi peta sumber, satu baris per segmen.
- Batalkan pemetaan jejak tumpukan — tempel jejak tumpukan termampatkan lengkap dan dapatkan kembali jejak yang sama dengan setiap
file:line:columnyang dapat dikenali ditulis ulang ke lokasi aslinya.
Di mana mencari peta sumber
Sebagian besar bundler (webpack, esbuild, Vite, Rollup, Terser) dapat memancarkan satu secara otomatis — cari komentar //# sourceMappingURL= di akhir file termampatkan. Jika menunjuk ke URL .map, ambil konten file tersebut; jika itu adalah URI data:application/json;base64,... inline, dekode Base64 dan tempel JSON yang dihasilkan di sini.
Pertanyaan yang Sering Diajukan
Mengapa pencarian posisi perlu baris/kolom berbasis-1?
Karena itulah yang Anda lihat di tempat lain — indikator baris/kolom editor kode, DevTools browser, dan jejak tumpukan JavaScript semuanya menghitung dari 1. Alat ini mengonversi secara internal ke kolom berbasis-0 yang sebenarnya digunakan peta sumber, jadi Anda tidak perlu melakukan perhitungan itu sendiri.
Apakah cuplikan konteks selalu muncul?
Hanya ketika peta sumber menyematkan konten file asli (sourcesContent). Beberapa alat build menghilangkannya untuk membuat peta tetap kecil — tanpanya, alat masih dapat melaporkan file asli yang tepat, baris dan kolom, hanya tanpa pratinjau kode.
Bagaimana jika jejak tumpukan saya mencakup beberapa file?
Alat ini menerapkan satu peta sumber yang ditempel ke setiap frame yang dapat mengurai file:line:column — nama file itu sendiri tidak dicocokkan, jadi berfungsi dengan baik untuk jejak tumpukan yang sepenuhnya dari satu bundel. Untuk jejak tumpukan yang mencakup beberapa file bundel, batalkan pemetaannya beberapa frame pada satu waktu dengan peta sumber untuk file yang sebenarnya dimiliki oleh setiap frame.
Kode saya tidak termampatkan — saya hanya ingin membacanya
Untuk kode yang tidak termampatkan dan sudah dapat dibaca yang ingin Anda format ulang, gunakan Formatter Kode JavaScript sebagai gantinya. Untuk pergi ke arah lain — kecilkan sumber Anda ke file termampatkan yang didekode peta sumber — lihat Pemampatkan JavaScript.
Privasi
Semuanya berjalan di browser Anda — peta sumber, jejak tumpukan dan file apa pun yang Anda unggah tidak pernah meninggalkan perangkat Anda.
Cara lain menggunakan alat ini
REST API
curl -X POST https://api.iotools.cloud/v1/tool/source-map-decoder \
-H "Authorization: Bearer YOUR_API_KEY" \
-H "Content-Type: application/json" \
-d '{
"mode": "position",
"sourceMapText": "{\"version\":3,\"sources\":[\"src.js\"],\"sourcesConten…",
"minifiedLine": "1",
"minifiedColumn": "21",
"contextLines": "1"
}'Ganti dengan kunci Anda sendiri dari akun Anda. Bidang alat menjadi isi permintaan — tanpa pembungkus.
Tanyakan ke agen AI
Use the IOTools `source-map-decoder` tool (JavaScript Source Map Decoder) on this input:
YOUR_INPUT_HERETempelkan ini ke agen mana pun yang terhubung ke server MCP IOTools, lalu tambahkan input Anda.
Widget sematan
<iframe
src="https://iotools.cloud/embed/source-map-decoder/"
width="100%" height="520" frameborder="0" scrolling="no" loading="lazy"
title="Pembaca Peta Sumber JavaScript — iotools.cloud"
sandbox="allow-scripts allow-forms allow-same-origin allow-downloads allow-popups allow-popups-to-escape-sandbox"
allow="clipboard-write"
style="width:100%;border:1px solid #e5e7eb;border-radius:12px;overflow:hidden"></iframe>
<script src="https://iotools.cloud/embed.js" async></script>Tempelkan ini di halaman Anda sendiri — gratis, tanpa kunci, cukup tautan balik.
| Biaya per panggilan | Mulai dari 5 kredit |
|---|