我正在使用Vscode 1.33.1, Node 11.12, Typescript 3.4.3, vscode-chrome-debug-core 6.7.46来尝试调试React Native项目。
只要没有遇到await
,一切都运行得很好。然而,当我遇到包含await
的代码时,我就不会在await
之后触发任何断点(包括await
本身)。代码会正常运行,但调试器会出现错误。如果我在await
之前设置一个断点,并尝试step in/over/out,它就会跳转到丑陋的index.bundle
代码中。
这在我的应用程序的多个位置上都会发生,因此它不是一个孤立的问题。
这是我launch.json
中的活动配置:
{
"name": "Debug iOS (sim)",
"program": "${workspaceRoot}/.vscode/launchReactNative.js",
"type": "reactnative",
"request": "launch",
"platform": "ios",
"sourceMaps": true,
"outDir": "${workspaceRoot}/.vscode/.react",
"smartStep": true,
"skipFiles": [
"${workspaceFolder}/node_modules/**/*.js",
"${workspaceFolder}/lib/**/*.js",
"<node_internals>/**/*.js"
]
},
从配置上看,我已经尝试了smartStep
(但是Vscode说不允许),skipFiles
(它确实会跳过文件,除非我明确地进入文件,所以它有效,但不能解决问题)。我也看过Debug Node.js Async/Await with Typescript+VSCode,但我已经尝试了smartStep
,而那个问题的担忧已经过时并且已经在许多发布版本中解决。
如何正确地调试包含await
的Typescript代码?
更新:当我绕过Vscode的调试/配置,在Chrome和vanilla终端(即react-native run-ios
)中调试,它工作得很完美。所以这与Vscode或其配置有关。
更新2:我正在针对ES2017进行目标设置,这是我的tsconfig
:
{
"compilerOptions": {
"target": "es2017",
"module": "commonjs",
"jsx": "react-native",
"strict": true,
"noImplicitAny": false,
"moduleResolution": "node",
"baseUrl": "./app",
"paths": {
"assets/*": ["assets/*"],
"components/*": ["components/*"],
"navigation/*": ["navigation/*"],
"utils/*": ["utils/*"],
"views/*": ["views/*"],
"types/*": ["types/*"],
"services/*": ["services/*"],
"state/*": ["state/*"],
"constants/*": ["constants/*"]
},
"allowSyntheticDefaultImports": true,
"esModuleInterop": true
}
}