在VS Code中使用Node Shim调试React Native

Question

我有一个React Native项目（从Ignite CLI 2.0.0默认样板创建），该项目需要对基于节点的包有所依赖。

所以，我创建了一个transformers.js ， babel-transform.js和rn-cli.js根据ReactNativify 。 这基本上等同于普通.babelrc文件中的内容，并使用babel-plugin-rewrite-require换出Node对象，并用Browserify垫片或空模拟替换它们。 到现在为止还挺好。

现在，问题是在Visual Studio代码（ 1.13.1 ）中调试它。 我已经进行了RN调试， 经历了一次重大的冒险 （或恐怖的故事，如果可以的话），但是我认为在将Node降级为7.10.1后可以运行它。

一切似乎进展顺利，在断点处暂停，逐步执行代码等，但是，这是实际的代码，而不是填充了垫片的已编译输出！ 此外，断点在没有代码缩进的只读代码窗口中打开。

我的调试配置是：

    {
        "type": "node",
        "request": "launch",
        "name": "Launch Tests",
        "program": "${workspaceRoot}/node_modules/.bin/jest",
        "args": [
            "--runInBand",
            "--no-cache"
        ]
        // Not needed, but tried ;)
        //  "runtimeArgs": [
        //     "--debug-brk=127.0.0.1:5858"
        //  ],
        //  "port": 5858
    }

有人有类似的，希望更好的体验吗？

PS。 与此相关的可能是vscode github问题（＃26782） 。

Answer 1

在我的问题中，我遇到了两个问题。

第一个是针对实际代码执行的测试，这似乎是Jest的问题。 笑话小组说：

这是预期的行为。 Jest应该在源文件上运行。 在任何大型代码库上，在运行测试之前生成捆绑包的速度都太慢，因此Jest可以及时编译文件，这使其速度更快。

现在这可能是一种沟通不畅的问题，您可以将其与适当的babel-jest配置配合使用来进行动态转换，但我没有得到团队的进一步帮助。 因此，我决定选择其他测试平台（Mocha，Jasmine和/或Karma）。

如果您想和Jest一起碰碰运气，可以继续关注以下话题： https : //github.com/facebook/jest/issues/4028

第二个问题是在调试会话期间在VS中的只读面板中打开代码，这是Microsoft正在处理的一个开放问题。 您可以在此处检查进度： https : //github.com/Microsoft/vscode/issues/26782

[ 更新 ：我刚刚收到Jest团队的进一步指示：

@aschrijver Jest处理此问题的一般方法是自己进行编译。 因此，您可以在配置中设置转换器，Jest本身会使用它来进行编译。

https://facebook.github.io/jest/docs/configuration.html#transform-object-string-string

这里是Typescript的示例配置，可让您大致了解它的外观： https : //github.com/kulshekhar/ts-jest

就垫片而言，我认为您可能想要的实际上是开玩笑的嘲笑。 导入或需要Jest模拟时，可以插入而不是实际模块。

]