gpt4 book ai didi

typescript - 如何使用 TypeScript 调试用 Expo 创建的 React Native 项目

转载 作者:行者123 更新时间:2023-12-04 13:43:52 25 4
gpt4 key购买 nike

我创建了一个使用 TypeScript 的 Expo 样板项目。

当我使用 expo start 运行应用程序时,Chrome 调试器在 http://localhost:19001/debugger-ui/ 打开,但在开发工具中我只能看到 .js文件:

enter image description here

我怎样才能得到我的 .tsx源文件显示?

我有 "sourceMap": true,.tsconfig.json.map文件沿 .js 生成文件。我在这里缺少更多配置吗?

最佳答案

它与 React Native Debugger 一起开箱即用。恕我直言,它是比 Chrome devtools 更好的工具,因为它还具有查看 Inspector 和 Redux 调试器。

  • expo init ts-expo-demo , 模板: » 标签 (TypeScript)
  • expo start -a
  • 启动 React Native 调试器
  • 在 Android 模拟器中启动应用程序后,按 Ctrl+M 打开 Expo 菜单
  • 激活“调试远程 JS”(这将打开浏览器)
  • 记下打开的浏览器中的端口(例如 19000)
  • 关闭浏览器
  • 在 React Native Debugger 中创建新窗口并附加到指定的端口,例如19000(按Ctrl+T打开新窗口)
  • 在模拟器中重新加载应用程序(按 R 两次,或 Ctrl+M -> 重新加载)

  • 这应该连接到 React Native Debugger 并且在 Sources -> Page -> RNDebuggerWorker.js -> 127.0.0.1:19000 你会发现未编译的 TypeScript 文件
    React Native Debugger: 0.11.5
    expo: 4.0.16
    https://github.com/jhen0409/react-native-debugger/releases
    enter image description here

    关于typescript - 如何使用 TypeScript 调试用 Expo 创建的 React Native 项目,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/52477708/

    25 4 0
    Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
    广告合作:1813099741@qq.com 6ren.com