Upgrade to Pro — share decks privately, control downloads, hide ads and more …

sourcemap規格概要

 sourcemap規格概要

rchaser53

June 15, 2017
Tweet

More Decks by rchaser53

Other Decks in Programming

Transcript

  1. sourcemap の出力結果 実際は1 行だけど見づらいから改行している { "version" : 3, "file": "out.js",

    "sourceRoot": "", "sources": ["foo.js", "bar.js"], "sourcesContent": [null, null], "names": ["src", "maps", "are", "fun"], "mappings": "A,AAAB;;ABCDE;" }
  2. interface と概要 { version: 3; // version 3 3固定 file:

    string; // 対象 sourceRoot?: string; // 基準 sources: string[]; // 対象 元 sourcesContent?: string[]; // 変換元 names: string[]; // 対象 出力 mappings: string; // 生成前 位置 }
  3. 便利なライブラリ集 mozilla/source-map sourcemap を作成やsourcemap 同士の関連付けに使える babel, webpack, uglify などが使用(TypeScript は未使用)

    azu/multi-stage-sourcemap お手軽簡単に多段ソースマップが作成できる 上のライブラリのサンプルコードとして使える