From c7c57cc6cea7554e687da8cdc891172fa4a4b229 Mon Sep 17 00:00:00 2001 From: Travis CI Date: Mon, 25 Jan 2016 17:54:21 +0000 Subject: [PATCH] update website --- docs/running-on-device-ios.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/running-on-device-ios.html b/docs/running-on-device-ios.html index b35709c075a..5f97fc4613b 100644 --- a/docs/running-on-device-ios.html +++ b/docs/running-on-device-ios.html @@ -1,4 +1,4 @@ -Running On Device – React Native | A framework for building native apps using React
React Native

Quick Start

Guides

Guides (iOS)

Guides (Android)

components

apis

Polyfills

Running On DeviceEdit on GitHub

Note that running on device requires Apple Developer account and provisioning your iPhone. This guide covers only React Native specific topic.

Accessing development server from device #

You can iterate quickly on device using development server. To do that, your laptop and your phone have to be on the same wifi network.

  1. Open AwesomeApp/ios/AwesomeApp/AppDelegate.m
  2. Change the IP in the URL from localhost to your laptop's IP. On Mac, you can find the IP address in System Preferences / Network.
  3. In Xcode select your phone as build target and press "Build and run"

Hint

Shake the device to open development menu (reload, debug, etc.)

Using offline bundle #

You can also pack all the JavaScript code within the app itself. This way you can test it without development server running and submit the app to the AppStore.

  1. Open AwesomeApp/ios/AwesomeApp/AppDelegate.m
  2. Follow the instructions for "OPTION 2":
    • Uncomment jsCodeLocation = [[NSBundle mainBundle] ...
    • Run the react-native bundle --platform ios --dev false --entry-file index.ios.js --bundle-output iOS/main.jsbundle command in terminal from the root directory of your app

The bundle script supports a couple of flags:

  • --dev - a boolean with a default value of true. With the --dev true flag, the bundled JavaScript code turns on useful development warnings and limits performance optimizations. For production it is recommended to pass --dev false. Also for production, be sure to have your native build configuration set to Release (e.g., Xcode's Release configuration for iOS and gradle's assembleRelease task for Android) in order to disable things like the shake-to-show developer menu.
  • --minify - pipe the JS code through UglifyJS.

Note that on 0.14 we'll change the API of react-native bundle. The major changes are:

  • API is now entry-file <path> based instead of url based.
  • Need to specify which platform you're bundling for --platform <ios|android>.
  • Option --out has been renamed for --bundle-output.
  • Source maps are no longer automatically generated. Need to specify --sourcemap-output <path>

Disabling in-app developer menu #

When building your app for production, your app's scheme should be set to Release as detailed in the debugging documentation in order to disable the in-app developer menu.

Troubleshooting #

If curl command fails make sure the packager is running. Also try adding --ipv4 flag to the end of it.

If you started your project a while ago, main.jsbundle might not be included into Xcode project. To add it, right click on your project directory and click "Add Files to ..." - choose the main.jsbundle file that you generated.

Next →
© 2015 Facebook Inc.
React Native

Quick Start

Guides

Guides (iOS)

Guides (Android)

components

apis

Polyfills

Running On DeviceEdit on GitHub

Note that running on device requires Apple Developer account and provisioning your iPhone. This guide covers only React Native specific topic.

Accessing development server from device #

You can iterate quickly on device using development server. To do that, your laptop and your phone have to be on the same wifi network.

  1. Open AwesomeApp/ios/AwesomeApp/AppDelegate.m
  2. Change the IP in the URL from localhost to your laptop's IP. On Mac, you can find the IP address in System Preferences / Network.
  3. In Xcode select your phone as build target and press "Build and run"

Hint

Shake the device to open development menu (reload, debug, etc.)

Using offline bundle #

When you run your app on device, we pack all the JavaScript code and the images used into the app's resources. This way you can test it without development server running and submit the app to the AppStore.

  1. Open AwesomeApp/ios/AwesomeApp/AppDelegate.m
  2. Uncomment jsCodeLocation = [[NSBundle mainBundle] ...
  3. The JS bundle will be built for dev or prod depending on your app's scheme (Debug = development build with warnings, Release = minified prod build with perf optimizations).

Disabling in-app developer menu #

When building your app for production, your app's scheme should be set to Release as detailed in the debugging documentation in order to disable the in-app developer menu.

Troubleshooting #

If curl command fails make sure the packager is running. Also try adding --ipv4 flag to the end of it.

Note that since v0.14 JS and images are automatically packaged into the iOS app using Bundle React Native code and images Xcode build phase.

Next →
© 2015 Facebook Inc.