typescript - 如何让 VSCode 加载 NPM 依赖项的源映射？

Question

我有一个用 TypeScript 编写的依赖项。依赖包括 NPM 包中的源映射和原始源。如果我在我的代码中设置断点然后单步执行依赖项，它会正确地单步执行 TypeScript 而不是编译的 JavaScript。但是，如果我在 TypeScript 代码中设置断点然后启动我的应用程序，VSCode 会显示

Breakpoint ignored because generated code not found (source map problem?).

如果我在进入依赖项后设置断点，一切正常。

我认为这里的问题是源映射是单向的，所以当我在 TypeScript 源文件中有一个断点时，它不知道它在 JavaScript 中的位置(这是通过节点实际设置断点所必需的)调试器)。打开 JavaScript 文件后，VSCode 能够将两者匹配起来，现在断点起作用了。

所以问题是，我怎样才能让我的 TS 断点从启动开始工作，而不必首先进入文件？依赖项是很多文件，每次运行都必须重置我的断点是有问题的，特别是因为如果我花费的时间太长(超过几秒钟)，我正在调试的特定问题会遇到套接字连接超时。

我想要的是一种告诉 TypeScript 的方法，“在调试器启动时解析这些 JavaScript 文件并同步源映射，以便断点正确匹配”。

我知道通用功能是可用的，因为我可以通过 TypeScript 文件中的断点成功调试依赖项本身(我是依赖项的维护者)。当它作为 NPM 模块加载时，似乎丢失了一些信息。

Answer 1

这正是 launch.json 文件中的 outFiles 属性的用途 - 将其设置为包含节点模块(和您自己的代码)中的 javascript 文件的 glob 模式。调试适配器将查看这些文件以获取 sourcemap 引用，因此它可以立即解决 TS 文件中的断点。

例子:

"outFiles": [ "${workspaceRoot}/myOutFiles/**/*.js", "${workspaceRoot}/node_modules/**/*.js"]

如果您只知道一组包含源映射的节点模块，您可以像这样提高性能:

"outFiles": [ "${workspaceRoot}/node_modules/{module_a,module_b}/**/*.js"]

来自本期:https://github.com/Microsoft/vscode-node-debug/issues/82#issuecomment-290642560