React NativeのiOS/Androidを実機とシュミレーターで起動する方法

忘備録としてReact NativeアプリケーションをiOS/Androidのシュミレーター/実機アプリで立ち上げる方法について簡単にまとめる。初回起動についてはGetting Started|React Nativeを参考にするのがよい。あくまで立ち上げ方を忘れた時用。

サンプルのアプリケーションを用意する

何かしらのアプリケーションは必要なので、ない場合は下記のコマンドで用意する。

$ react-native init [APP_NAME]

iOS

シュミレーター

react-native run-iosを実行するとiOSシュミレーターが起動する。

実機

iosディレクトリにあるAppName.xcodeprojをXcodeで開く。
下記の画像のようにビルド先を選択してビルドボタンをクリック。

iPhoneがロックされていると出た場合

iPhoneがロックされていないにも関わらず、下記のようなエラーが出る場合は「位置情報とプライバシーをリセット」をするとよい。(参考: Development cannot be enabled while your device is locked.)

development teamを選択するよう出た場合

Signing for "TabbarSample" requires a development team. Select a development team in the project editor.
Code signing is required for product type 'Application' in SDK 'iOS 10.2'

TARGETS ＞ General ＞ Signing ＞ Automatically manage signing にて、適切なチームを選択する。

(参考: Xcode 8: xcodebuildで、Automatic Signingに対応する)

Android

初めてのセットアップの場合は、こちら(Android Setup)の記事を参考にするとよい。

シュミレーター

Android開発ではGenymotionを使うのがよさそう。個人利用の場合は無料。
Genymotionを起動して仮想デバイスを選択した状態でreact-native run-android

⌘+Mでデバッグメニューの表示。

実機

開発者モードからUSBデバッグをONにする。adb devicesで接続を確認する。
その状態でreact-native run-android

その他

Application SampleApp has not been registered. エラー

Application SampleApp has not been registered.のようなエラーが出た場合、プロセスが残ってしまっているのが原因かもしれない。(参考: react−nativeの最初につまずいたところメモφ(｡_｡ ))

$ ps aux | grep react
kotazi           34534   0.1  1.0  3277536 163328 s002  S+    9:00PM   0:09.91 node /SampleApp/node_modules/react-native/packager/../local-cli/cli.js start
kotazi           34529   0.0  0.0  2437480    828 s002  S+    9:00PM   0:00.00 bash /SampleApp/node_modules/react-native/packager/launchPackager.command
kotazi           37067   0.0  0.0  2424600    456 s005  R+    9:31PM   0:00.00 grep --color=auto react
$ kill -9 34534