ソースマップで元の位置に
Source Map Resolver
渡されたソースマップを使って、圧縮済みのスタックトレースを元のファイルと行番号に戻します。
圧縮されたバンドルから出たスタックトレースと`.map`ファイルを受け取り、それぞれのフレームが元のどのファイルの何行目から来たのかを示します。すべてタブの中で復元します。マップも、社内のパスがそのまま出がちなスタックトレースも、どこへも出ていきません。
ソースマップ (.map)
.map ファイルをドロップ
このタブで読みます。どこにもアップロードしません。
圧縮後のスタックトレース
names テーブルから復元した元の名前まで扱います。元のソース行が出るのは、マップが sourcesContent を同梱しているときだけです。それがないマップは位置を知っているだけで、コードは知りません。読み取れないフレーム行はそのまま通します。使い方
マップを用意します
`.map`ファイルそのものか、バンドルの末尾にある`sourceMappingURL`のコメントの`data:` URIのどちらかです。どちらもここに貼り付けられます。
スタックトレースを貼り付けます
エラーの報告からそのまま持ってきて構いません。`Error:`の行を含めて丸ごとです。パースできないフレームは、消えずにそのまま通り抜けます。
元の位置を読みます
フレームごとに、元のファイルと行と列が出ます。マップの`names`の表にあれば、元の関数名も一緒に出ます。復元したトレース全体は、ボタン1つでコピーできます。
よくある質問
元のソースの行が表示されないのはなぜですか
マップに`sourcesContent`が入っていないからです。それが無いマップは、どこにあったかは知っていても、そこに何が書かれていたかは知りません。手元のマップに入っているかどうかは、マップの下の表示に出ます。コードまで見たいなら、パスだけを持つ設定ではなく`sourcemap: true`でビルドしてください。
あるフレームに「この位置に対応づけがありません」と出ます
そのフレームの列が、どの対応づけの区間にも入らないということです。たいていは、例外を投げたファイルとは別のビルドのマップだという合図です。新しいコードに古いマップを添えて配布したか、CDNがキャッシュ済みのバンドルを返している場合です。
本番のソースマップをここに貼り付けても大丈夫ですか
タブの外へは出ません。VLQの復号も位置の照会も、ブラウザの中で行います。ただし`sourcesContent`の入ったマップには元のソースが丸ごと入っているので、ここでは問題が無くても、どこに貼り付けるかは一般には気にすべきことです。
ソースマップのどのバージョンを読みますか
いま誰もが出力しているv3です。とても大きなバンドルに使う`sections`形式のインデックスマップには対応していません。該当のフレームを含む区間のマップを、別に渡してください。
ここから渡せます
JavaScript整形・圧縮
JavaScript Beautifier & Minifier
名前は一切変えずにJavaScriptやTypeScriptからコメントと空白だけを落とし、1行に潰れたバンドルは読めるところまでインデントし直します。
JSONフォーマッター・検証
JSON Formatter & Validator
JSONを整形・圧縮して検証し、構文エラーがあれば行と列を正確に指し示します。
YAMLフォーマッター・検証
YAML Formatter & Validator
YAMLのインデントを揃えて検証し、パーサを壊すタブやアンカーの誤りに印を付けます。
TOMLフォーマッター・検証
TOML Formatter & Validator
TOMLを整形して検証し、テーブルの順序とインラインテーブルの書き方を揃えます。
次の一手
このツールが出したものをそのまま受け取れる道具です。
HARビューアー・匿名化
HAR Viewer & Sanitiser
HARのキャプチャをウォーターフォールで開き、共有する前にクッキー・認証ヘッダー・トークンを削ぎ落とします。
16進ダンプビューアー
Hex Viewer
どんなファイルもオフセット・16進・ASCIIのダンプで開き、マジックバイトから形式を当て、検索の当たりを光らせます。
JavaScript整形・圧縮
JavaScript Beautifier & Minifier
名前は一切変えずにJavaScriptやTypeScriptからコメントと空白だけを落とし、1行に潰れたバンドルは読めるところまでインデントし直します。
Base64エンコード・デコード
Base64 Encoder & Decoder
テキストでもファイルでもBase64とBase64URLを符号化・復号し、UTF-8も正しく扱います。
curlをコードに変換
curl to Code
curlのコマンドをfetch・axios・Pythonのrequests・Go・PHP・PowerShellのコードに変換します。
文字列のハッシュ
Text Hash
文字列のMD5・SHA-1・SHA-256・SHA-384・SHA-512・CRC-32を計算し、大文字表記とBase64での出力も選べます。