如何在真实设备上捆绑和部署React-Native iOS应用程序

时间:2016-07-21 14:48:02

标签: javascript ios iphone reactjs react-native

我无法找到有关如何将App捆绑并部署到实际设备的最新版React-Native的文档。

我在iPhone上打开远程调试器时出现红屏错误,但是应用程序在没有启用远程调试器的情况下加载。

我还没有更改@"index.ios"中的任何网址,rootBundle仍然是showList

2 个答案:

答案 0 :(得分:2)

感谢Monochrome的回答,它很有帮助!

我从第4步开始遇到问题,我的AppDelegate.m文件看起来和你解释的不一样。

jsCodeLocation = [[RCTBundleURLProvider sharedSettings]      
jsBundleURLForBundleRoot:@"index.ios" fallbackResource:nil];

  RCTRootView *rootView = [[RCTRootView alloc] initWithBundleURL:jsCodeLocation
                                                  moduleName:@"Kompas"
                                                  initialProperties:nil
                                                  launchOptions:launchOptions];

答案 1 :(得分:1)

我自己是RN开发的初学者,并且在第一次尝试在真实设备上运行我的应用时也遇到了同样的问题。在这里,我想与大家分享一下我是如何最终实现的:

  1. 首先,请确保您的iPhone(或iPad)通过电缆连接到Mac;

  2. 然后检查您的Mac和iPhone是否都连接到同一个Wi-Fi网络;

  3. 然后是棘手的部分。如果您使用RN ver< 0.30,您必须正确配置Info.plist文件。为了清楚起见,您必须禁用诸如App Transport Security(ATS)之类的东西。这是iOS 9中的一项安全功能,可以阻止智能手机上可能发生的任何未经授权的网络活动,以保持简单。令人遗憾的是,ATS认为启动RN应用程序是一种活动并阻止它。所以你必须打开你的Info.plist文件并添加这个代码,由Facebook团队正式证明:

    <key>NSAppTransportSecurity</key>
    <dict>
    <key>NSAllowsArbitraryLoads</key>
    <true/>
    </dict>
    

    你可能想知道为什么你现在没有在Docs中看到它 - 好吧,据我所知,这是因为在RN ver 0.30中它们默认禁用ATS(you can read about it in the bottom of the page

  4. 现在您需要打开AppDelegate.m文件并找到以下行:

    jsCodeLocation = [NSURL URLWithString:@"http://localhost:8081/index.ios.bundle?platform=ios&dev=true"];

    取消注释,然后将其更改为: jsCodeLocation = [NSURL URLWithString:@"http://Your.Mac's_Ip.Address.Here:8081/index.ios.bundle?platform=ios&dev=true"];

    喜欢那样: jsCodeLocation = [NSURL URLWithString:@"http://255.255.255.255:8081/index.ios.bundle?platform=ios&dev=true"];

  5. 然后转到您的模拟器选择列表(idk如何调用它,实际上,只需查看我的屏幕截图:D)并选择您连接的设备。

    Xcode screenshot

  6. 然后点击“运行”,你应该好好去!

    但请记住,有两种方法可以在设备上运行您的应用。第一个选项(我上面已经描述过)允许你在编辑器中编写代码,点击保存按钮,然后将在手机上重新加载应用程序以及你可以在模拟器中执行的所有操作,但是当你断开iPhone的连接时在您的Mac上,您将无法在设备上本地运行您的应用。

    要使其在没有连接到Wi-Fi或Mac的情况下在本地工作,只需取消注释在OPTION 2下编写的行(不需要在其中更改任何内容)。

    jsCodeLocation = [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"];

    之前的所有步骤都保持不变。

    希望它有所帮助!