如何在Visual Studio代码调试器中使用Jest时配置源映射

nau*_*boy 20 debugging jestjs babeljs react-native visual-studio-code

我正在使用react native编写应用程序,我希望能够使用jest框架测试我的代码并使用visual studio代码编辑器调试器来设置断点.我目前遇到的问题是无论我如何运行调试器,无论是通过生成新实例还是附加它,我似乎无法从babel中获取源映射.我在.babelrc文件中尝试过各种配置,但似乎都没有.

VScode版本 - 1.6.0(最新)

我的目录结构类似于此

-package.json
-node_modules
-.babelrc
-dist
-app
 -myModule.js
 -test
   -myModule.spec.js
Run Code Online (Sandbox Code Playgroud)

然后在我的.babelrc中我有以下内容

{
    "presets" : ["react-native"],
    "sourceMaps" : true,
    "outDir" : "./dist"
}
Run Code Online (Sandbox Code Playgroud)

我已经尝试设置sourceMaps道具都trueinline两者没有与当前的工作launch.json配置.

这是我launch.json运行Jest测试器的

{

            "name" : "Launch via jest",
            "type": "node",
            "request": "launch",
            "program" : "${workspaceRoot}/node_modules/jest/bin/jest.js",
            "cwd": "${workspaceRoot}",
            "args": [
                "--runInBand"
            ],
            "runtimeArgs": [
                "--harmony"
            ],
            "sourceMaps": true,
            "outDir" : "${workspaceRoot}/dist"
}
Run Code Online (Sandbox Code Playgroud)

两者--harmony--runInBand有必要得到调试器,因为玩笑正常工作将产生一个子进程与端口冲突.

我的package.json中还有其他Jest配置

"jest": {
    "preset": "jest-react-native"
  }
Run Code Online (Sandbox Code Playgroud)

现在,无论何时我运行调试器,它都会运行,它会在babel输出的断点处停止,而不是原始源,这对于帮助不大.我还应该提一下,测试本身是由babel编译的,我不确定它是否重要.

任何指针或不同的配置都欢迎.

小智 6

.babelrc 选项是sourceMap单数的。{ "sourceMap" : "inline" }对我有用。