VS Code 中的 React Native:将 iOS 设备的配置添加到 launch.json

Posted

技术标签:

【中文标题】VS Code 中的 React Native:将 iOS 设备的配置添加到 launch.json【英文标题】:React Native in VS Code: add configuration for iOS Device to launch.json 【发布时间】:2017-07-03 04:06:48 【问题描述】:

我在 Visual Studio 代码中打开了一个 React Native 项目,我试图在物理连接的 ios 设备上运行该项目。我直接从 Xcode 成功地在设备上运行了该应用程序,但是从 Visual Studio Code 我遇到了问题。我相信我需要将设备的配置添加到 launch.json 中。我在那里尝试了不同的条目,但似乎不起作用。为已连接的 iOS 设备添加配置的正确方法是什么?

【问题讨论】:

【参考方案1】:

如果您需要针对特定​​设备,可以这样做:


  "name": "iOS Device",
  "program": "$workspaceRoot/.vscode/launchReactNative.js",
  "type": "reactnative",
  "request": "launch",
  "platform": "ios",
  "sourceMaps": true,
  "target": "device",
  "outDir": "$workspaceRoot/.vscode/.react",
  "runArguments": [
    "--device",
    "DEVICE NAME"
  ],

所以你需要设置"target": "device"告诉调试器在设备上运行,然后你通过"runArguments"设置设备名。

【讨论】:

【参考方案2】:

试试react-native run-ios --device "your device name"

您可以在 xcode 中找到的设备名称

您也可以在package.json 中添加此内容


    start:ios: "node node_modules/react-native/local-cli/cli.js run-ios --device \"your device name\""

您可能需要安装ios-deploy

npm install -g ios-deploy

对于 vscode launch.json 你也可以在launch.json 中添加这些配置node node_modules/react-native/local-cli/cli.js run-ios --device \"your device name\"

launch.json


        "type": "node",
        "request": "launch",
        "name": "Run app",
        "program": "$workspaceRoot/node_modules/react-native/local-cli/cli.js",
        "cwd": "$workspaceRoot",
        "runtimeArgs": [
            "run-ios",
            "--device",
            "\"your device name\""
        ],
    

【讨论】:

这似乎不起作用,基尚。我已经使用了配置的默认样式,让它工作,看看我的答案。【参考方案3】:

这就是我最终拥有并设法让它在连接的设备上安装和启动的东西。键 name 的值似乎不能唯一标识连接的设备。它只是设备调试下拉菜单中显示的名称。

    
        "name": "My iPad",
        "program": "$workspaceRoot/.vscode/launchReactNative.js",
        "type": "reactnative",
        "request": "launch",
        "platform": "ios",
        "target": "device",
        "sourceMaps": true,
        "outDir": "$workspaceRoot/.vscode/.react"
    ,

【讨论】:

以上是关于VS Code 中的 React Native:将 iOS 设备的配置添加到 launch.json的主要内容,如果未能解决你的问题,请参考以下文章

React-Native在vs code开发,提示 “types” 只能在ts中使用的解决方案

React Native 中的 flex vs flexGrow vs flexShrink vs flexBasis?

vs code 开发react用啥插件

快速刷新在 Visual Studio Code 中的 React Native 中不起作用

VS Code 自动将语言从 React 更改为 JavaScript

React Native之code-push的热更新(ios android)