なぜ MAP を JS に変換するのですか？
JavaScript ソースマップは、コンパイルまたは縮小された .js ファイル内の位置が元のソースとどのように対応するかを記録するものです。これはブラウザのデベロッパーツールのデバッグ補助として .js と共に存在し、単体での実行価値はありません。コードは含まれず、VLQ でエンコードされた位置インデックスのみが含まれているため、.JS に変換することはできません。
MAP から JS への変換方法
VS Code FREE
VS Code で .map ファイルを開いてその JSON を読み取ります。sources 配列を確認してどの元のファイルをカバーしているかを確認し、sourcesContent に埋め込まれたソーステキストがないか確認します。
これらの形式について
.MAP
Source Map (JavaScript / CSS)
.mapファイルは、ほとんどの場合 JavaScript または CSS のソースマップです。これはブラウザのデベロッパーツール（DevTools）が、圧縮またはコンパイルされたコードの背後にある元の読みやすいソースを表示できるようにするための JSON…
.MAP の詳細を開く →
.JS
JavaScript Source File
JSファイルはJavaScriptのソースコードファイルです。これは、Node.jsを介してウェブページのインタラクティブ性やサーバーサイドアプリを動かす、プレーンで読み取り可能なテキストです。VS…
.JS の詳細を開く →品質と注意点
mappingsフィールドは VLQ (Base64 Variable-Length Quantity) でエンコードされており、JavaScript ではありません。開発者ツールのみがこれをデコードします。- マップ内に
sourcesContentが存在する場合、完全な元のソースが JSON 内に埋め込まれており、直接抽出することができます。 - 本番サーバーに
.mapファイルを配置すると、デベロッパーツールを開いているすべての人に元のソースコードとファイルパスが公開されることになります。
よくある質問
`.map` ファイルから元のソースコードを取り戻すことはできますか？
可能な場合があります。マップに
sourcesContent が含まれている場合、元のソースが埋め込まれており、ブラウザのデベロッパーツールや source-map npm パッケージを使用して抽出できます。`.map` の隣にある `.js` ファイルは何ですか？
それはブラウザが実際に実行する、縮小またはコンパイルされた JavaScript です。
.map はそれと元のソースとの関係を記述しているだけです。なぜビルドツールは `.map` ファイルを生成するのですか？
webpack、Vite、TypeScript などのツールは、コンパイルされた出力をデバッグする際にデベロッパーツールが元のソースを表示できるようにソースマップを出力します。
