Chrome 和 VS Code 中的断点都不会停留在调试器的行上
Breakpoints do not stay on their line in debugger both in Chrome and VS Code
我一直在努力弄清楚为什么我的调试器没有在适当的行上放置断点。
如下图所示，断点没有按预期工作：
Misbehaving breakpoints in Chrome
对于 VS 代码，这是我的脚本 运行:
"test-script": "env-cmd -f ./config/dev.env nodemon --inspect-brk --exec 'babel-node ./tests/$TEST_SCRIPT'"
Disappearing breakpoints in VS Code
我不确定这是 babel/webpack 配置错误还是调试器设置错误。
- 在
.babelrc 中，我尝试将 sourceMaps 设置为 true、"both"，
和 "inline" 但这并不能解决问题。
- 在我的 webpack 配置中
有
devtool = source-map 和 mode = development.
我真的不希望在任何地方都放置 console.log 语句并按预期使用调试器，因此我们将不胜感激。
谢谢！
这看起来像是在为没有它们的目标环境转译 async 函数时发生的情况。它们最终被彻底转换，以至于 regeneratorRuntime 可以处理它们，甚至 source maps 也无能为力。我通过在直接支持它们的现代浏览器上的开发和调试期间设置项目不转换 async 函数来解决它。然后，我们使用生产（转译）版本在 async 之前的目标浏览器上进行测试。如果我们必须追踪只在转译时发生的问题（非常罕见），我们会为开发重新打开它并插入 debugger; 语句。 :-|
我一直在努力弄清楚为什么我的调试器没有在适当的行上放置断点。
如下图所示，断点没有按预期工作：
Misbehaving breakpoints in Chrome
对于 VS 代码，这是我的脚本 运行:
"test-script": "env-cmd -f ./config/dev.env nodemon --inspect-brk --exec 'babel-node ./tests/$TEST_SCRIPT'"
Disappearing breakpoints in VS Code
我不确定这是 babel/webpack 配置错误还是调试器设置错误。
- 在
.babelrc中，我尝试将sourceMaps设置为true、"both"， 和"inline"但这并不能解决问题。 - 在我的 webpack 配置中
有
devtool=source-map和mode=development.
我真的不希望在任何地方都放置 console.log 语句并按预期使用调试器，因此我们将不胜感激。
谢谢！
这看起来像是在为没有它们的目标环境转译 async 函数时发生的情况。它们最终被彻底转换，以至于 regeneratorRuntime 可以处理它们，甚至 source maps 也无能为力。我通过在直接支持它们的现代浏览器上的开发和调试期间设置项目不转换 async 函数来解决它。然后，我们使用生产（转译）版本在 async 之前的目标浏览器上进行测试。如果我们必须追踪只在转译时发生的问题（非常罕见），我们会为开发重新打开它并插入 debugger; 语句。 :-|