编译器配置项-compilerOptions
输出相关配置项05
行内源码映射 - inlineSourceMap
设置inlineSourceMap
后,TypeScriptWh将源码映射内容嵌入到.js
文件中,来替代单独的.js.map
文件。虽然这样设置会导致.js
文件变大,但是这在某些特殊场景中更方便。 例如,你需要在不允许提供.js.map
文件的服务器上调试代码。
这个选项和sourceMap
选项互斥。
例如,有如下的TypeScript的代码:
const helloWorld = "hi";
console.log(helloWorld);
可以转换为如下JavaScript代码:
"use strict";
const helloWorld = "hi";
console.log(helloWorld);
然后启用inlineSourceMap
进行构建,.js
文件底部将包含一条注释,注释中包含该文件的源代码映射。
"use strict";
cons helloWorld = "hi";
console.log(helloWorld);
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyJpbmRleC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQUEsTUFBTSxVQUFVLEdBQUcsSUFBSSxDQUFDO0FBQ3hCLE9BQU8sQ0FBQyxHQUFHLENBQUMsVUFBVSxDQUFDLENBQUMifQ==
行内源代码 - inlineSources
设置inlineSources
后,原始.ts
文件的内容(source map的sourcesContent
属性)将被TypeScript作为嵌入字符串写入源映射中。它的使用场景和 inlineSourceMap
使用场景通常一样。
这个选项需要启用 sourceMap
或者 inlineSourceMap
选项。
例如,有以下TypeScript代码:
const helloWorld = "hi";
console.log(helloWorld);
默认转换为如下JavaScript代码:
"use strict";
const helloWorld = "hi";
console.log(helloWorld);
当启用inlineSources
和 inlineSourceMap
进行构建,.js
文件底部将有一条注释,其中包含该文件的源代码映射。请注意,这个文件结尾的内容与inlineSourceMap
的示例不同,因为源代码映射现在包含原始的源代码。
"use strict";
const helloWorld = "hi";
console.log(helloWorld);
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyJpbmRleC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQUEsTUFBTSxVQUFVLEdBQUcsSUFBSSxDQUFDO0FBQ3hCLE9BQU8sQ0FBQyxHQUFHLENBQUMsVUFBVSxDQUFDLENBQUMiLCJzb3VyY2VzQ29udGVudCI6WyJjb25zdCBoZWxsb1dvcmxkID0gXCJoaVwiO1xuY29uc29sZS5sb2coaGVsbG9Xb3JsZCk7Il19
映射文件跟路径 - mapRoot
指定调试器定位的映射文件的位置而不是生成的源代码映射文件位置。这里设置字符串将在每个源代码映射中被处理,例如:
{
"compilerOptions": {
"sourceMap": true,
"mapRoot": "https://my-website.com/debug/sourcemaps/"
}
}
index.ja
文件的源代码映射将解释到路径: https://my-website.com/debug/sourcemaps/index.js.map
。