概要
https://www.typescriptlang.org/tsconfig#declarationMap
{
"declarationMap": true
}
declarationオプションと併用するオプション。
これをtrue
にすると、型定義の map ファイルが作成されます。
VSCode など一般的なエディタでは、コードからその定義元にジャンプ(cmd + click
など)する機能が存在します。
VSCode では、JS ファイルで定義元にジャンプする際に、参照先の.ts
ファイルが同じディレクトリに存在する場合は直接そこに飛ぶことができますが、そうでない場合は型定義ファイル(.d.ts
)に飛びます。
型定義の map ファイルというのは拡張子.d.ts.map
を持つファイルで、この map ファイルがあると、定義元にジャンプした際に、型定義ファイルではなく実際の TS コードに飛ぶことができます。
公式サイトでは、Project References を使用する際にこれをtrue
にすることを推奨しています。
詳細
{
"outDir": "./dist",
"declaration": true,
"declarationMap": false
}
まず、最初に"declarationMap": false
な状態で、以下の 2 つのファイルをコンパイルします。
// func.ts
export const func = () => {
console.log("func");
};
// index.ts
import { func } from "./func";
func();
その状態でコンパイル結果のindex.js
のfunc
(↑)をcmd + click
すると、
ここ(↑)、つまり型定義ファイル(func.d.ts
)に飛びます。
次に、"declarationMap": true
で再度コンパイルします。
{
"declaration": true,
"declarationMap": true
}
// func.d.ts
export declare const func: () => Promise<string>;
//# sourceMappingURL=func.d.ts.map
// func.d.ts.map
{"version":3,"file":"func.d.ts","sourceRoot":"","sources":["../src/func.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,IAAI,uBAIhB,CAAC"}
結果は上記のように、型定義ファイルに map ファイルのパスのコメントが追加され、map ファイルも作成されました。
この状態で、先ほどのindex.ts
のfunc
をcmd + click
すると
ここ(↑)、つまり型定義ファイルではなく、実際の TS コードに飛びます。