React 本机(最新)调试器在 Mac 上的 Visual Studio 中不起作用

React native (latest) debugger not working in Visual Studio on Mac

提问人:Ntecha 提问时间:11/11/2023 最后编辑:Ntecha 更新时间:11/11/2023 访问量:25

问:

在过去的四天里,我一直在试图让它发挥作用。在完全更新的 Mac 上最新的 React Native / Expo / React Native Tools v1.12.1 上,尽管我已经遵循了我能找到的每一步,但我无法让调试器工作。

我把它到了调试控制台说的地步

Attaching to the application
Starting debugger app worker.
Established a connection with the Proxy (Packager) to the React Native application

但是,虽然没有生成错误,但当我使用默认的“附加到打包程序”选项时,它不想单步执行断点,甚至不想识别错误。

MacOS Ventura 13.6.1,VS 代码版本 1.79。

我可以让 Web 调试器工作,但不得不退出开发环境并重新构建并不理想。此外,当我尝试在 web/chrome 调试器中创建断点时,它会逐步执行到 node_modules 文件夹的深处,而不是坚持使用应用程序.js文件。

包.json

{
  "name": "test",
  "version": "1.0.0",
  "main": "node_modules/expo/AppEntry.js",
  "scripts": {
    "start": "expo start",
    "android": "expo start --android",
    "ios": "expo start --ios",
    "web": "expo start --web"
  },
  "dependencies": {
    "@expo/webpack-config": "^19.0.0",
    "expo": "~49.0.15",
    "expo-dev-client": "~2.4.12",
    "expo-status-bar": "~1.6.0",
    "react": "18.2.0",
    "react-dom": "18.2.0",
    "react-native": "0.72.6",
    "react-native-web": "~0.19.6"
  },
  "devDependencies": {
    "@babel/core": "^7.20.0"
  },
  "private": true
}

metro.config.js (必须手动生成这个,expo不再使用Metro Bundler,但调试器一直要求它)

// Learn more https://docs.expo.io/guides/customizing-metro
const { getDefaultConfig } = require('expo/metro-config');

/** @type {import('expo/metro-config').MetroConfig} */
const config = getDefaultConfig(__dirname);

module.exports = config;

启动.json

{
  // Use IntelliSense to learn about possible attributes.
  // Hover to view descriptions of existing attributes.
  // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
  "version": "0.2.0",
  "configurations": [
    {
      "name": "Attach to packager IP",
      "request": "attach",
      "type": "reactnative",
      "cwd": "${workspaceFolder}",
      "address": "192.168.1.2"
    },
    {
      "name": "Attach to packager",
      "cwd": "${workspaceFolder}",
      "type": "reactnative",
      "request": "attach"
    }
  ]
}
react-native visual-studio-code vscode-debugger

评论


答: 暂无答案