何をやったのか
Expoのv.24.0.0において、create-react-native-appで作ったアプリを$ exp detachしてシミュレーター起動までを一通りやって見た。
感想
予想以上に詰まった...
Expoは想像以上に、環境依存系のエラー対処が大変そう...
Expoを使っているみなさんの役に立ってくれれば...
実際の手順
1. detachする
基本的には、以下のコマンドでサクッと終わるはず
$ exp detach
注意点
- detachする際には、app.jsonには必須項目がある。 → 参考
- app.json中のandroidのpackage名には、ハイフンが使えない。
2. package.jsonの書き換え
package.json内のreact-nativeのモジュールを、expoのリポジトリ内にforkされているreact-nativeを使うように設定する。versionとかは、適宜直してください。
"dependencies": {
"expo": "^23.0.4",
"react": "16.0.0",
"react-native": "https://github.com/expo/react-native/archive/sdk-23.0.0.tar.gz"
}
この後に、以下のコマンドでnode_moduleを再インストールする。
$ rm -rf node_modules && yarn install
参考: Not using the Expo fork of react-native
3. pod installする
以下のコマンドで終了のはずだったんだけど...
$ cd ios
$ pod setup
$ pod install
// install boost(1.59.0)がいつまでたっても終わらない
解決策
割とハマりどころのようで、expoやcreate-react-native-appのissueにも同様の相談があった。以下のページのQuick Fixのようにして、再度$ pod installするとインストールできるようになる。
以下のコマンドで、ローカルのboost.podspec.jsonを開く
$ open ~/.cocoapods/repos/master/Specs/9/9/d/boost/1.59.0/boost.podspec.json
Urlを以下にしたがって変える
"source":{
"http":"https://downloads.sourceforge.net/project/boost/boost/1.59.0/boost_1_59_0.tar.gz?r=&ts=1513105136&use_mirror=kent"
},
参考: Quick Fix
4. iOSシミュレーターの立ち上げ
iOSは以下のコマンドで簡単に立ち上がった。
$ exp start
// 異なるタブで
$ react-native run-ios
5. Androidシミュレーターの立ち上げ
これも、当然以下で終わりのはず...
$ exp start
// 異なるタブで
$ react-native run-android
だったけどAndroid環境周りの色々なエラーに出会ったので、解決方法をメモ
Error①
FAILURE: Build failed with an exception.
* What went wrong:
Could not determine java version from '9.0.1'.
FAILURE: Build failed with an exception.
* What went wrong:
A problem occurred configuring project ':app'.
> Failed to notify project evaluation listener.
> Could not initialize class com.android.sdklib.repository.AndroidSdkHandler
解決方法
- Javaのversionを8系に下げる。
参考: Java 9だとAndroidプロジェクトのGradleが立ち上がらない
Error②
FAILURE: Build failed with an exception.
* What went wrong:
A problem occurred configuring project ':app'.
> SDK location not found. Define location with sdk.dir in the local.properties file or with an ANDROID_HOME environment variable.
解決方法
- ANDROID_HOMEの追加
- ダメなら、
android/直下に、local.propertiesというファイルを作り、そこに以下のコードを追加
sdk.dir = /Users/USERNAME/Library/Android/sdk
参考: React Native android build failed. SDK location not found
Error③
FAILURE: Build failed with an exception.
* What went wrong:
A problem occurred configuring project ':app'.
> You have not accepted the license agreements of the following SDK components:
[Android SDK Build-Tools 26.0.1, Android SDK Platform 26].
Before building your project, you need to accept the license agreements and complete the installation of the missing components using the Android Studio SDK Manager.
Alternatively, to learn how to transfer the license agreements from one workstation to another, go to http://d.android.com/r/studio-ui/export-licenses.html
解決方法
- 言われた通り、licenceに同意する
$ cd $ANDROID_HOME/tools/bin
$ cd ./sdkmanager --licenses
// 全てyes
参考: You have not accepted the license agreements of the following SDK components