前提
環境:"使い古した"Mac
いろいろ過去インストールしたものがあったりなどして一筋縄でいかなかった。
という人間のメモになります。
iOSはエミュレーター
Androidはエミュレーター+実機
quick startを始める
install
npm install -g create-react-native-app
プロジェクト作成からの早速エラー
create-react-native-app AwesomeProject
/opt/local/lib/node_modules/create-react-native-app/node_modules/fs-extra/lib/index.js:3
const assign = require('./util/assign')
^^^^^
SyntaxError: Use of const in strict mode.
at exports.runInThisContext (vm.js:69:16)
at Module._compile (module.js:432:25)
at Object.Module._extensions..js (module.js:467:10)
at Module.load (module.js:349:32)
at Function.Module._load (module.js:305:12)
at Module.require (module.js:357:17)
at require (module.js:373:17)
at Object.<anonymous> (/opt/local/lib/node_modules/create-react-native-app/build/index.js:233:16)
at Module._compile (module.js:449:26)
at Object.Module._extensions..js (module.js:467:10)
理由はnodeが古かった。
https://ja.stackoverflow.com/questions/29839/node-js%E3%81%A7const%E3%81%8C%E9%80%9A%E3%82%89%E3%81%AA%E3%81%84
nodeを更新する!
の前にnodebrewを入れる。
curl -L git.io/nodebrew | perl - setup
export PATH=$HOME/.nodebrew/current/bin:$PATH
nodeを更新
nodebrew install-binary
改めて、プロジェクト作成からの成功
npm install -g create-react-native-app
create-react-native-app AwesomeProject
Success! Created AwesomeProject
じゃあ始めようか
npm start
からのエラー。
quick startが使えないだと(Building Projects with Native Codeをなぞろう)…。
watchmanが入ってない様子。
brew install watchman
改めて、始めようか
npm start
できた。
iOSを始める
xcode いれて(更新して) cli tool入れて
run-ios
起動しました。
Androidを始める
エミュレーターの準備
cliでパスが通っていなかった?ので諸々パス追加
export ANDROID_HOME=$HOME/Library/Android/sdk
export PATH=$PATH:$ANDROID_HOME/tools
export PATH=$PATH:$ANDROID_HOME/tools/bin
export PATH=$PATH:$ANDROID_HOME/platform-tools
export ANDROID_SDK_ROOT=$ANDROID_HOME
avdmanager
エミュレーター起動せず。
Java周りを整理
IDEを使っていた為か、CLI周りの環境が整理されていなかった様子。
https://qiita.com/ringo/items/db58b34dc02a941b297f
apple側で入れていたjavaは使わなくなったようだ。
oracle側の
/Library/Java/JavaVirtualMachines/
こちらにインストールされるようになったしこちら側が使う方がよいようだ。
https://javaworld.helpfulness.jp/post-50/
ここの様子に似ている。
Javaのバージョン指定
JAVA_HOMEを設定することでそれが優先されるようになる。
export JAVA_HOME=`/usr/libexec/java_home -v 1.8`
java_homeコマンドを実行してバージョン指定できる
今回は1.8を使います。
emulatorにパスを通す
ERROR:android/android-emu/android/qt/qt_setup.cpp:28:Qt library not found at ../emulator/lib64/qt/lib
https://stackoverflow.com/questions/42554337/cannot-launch-avd-in-emulatorqt-library-not-found
bash_profileに以下(強制的に、ですね?)
function emulator { cd "$(dirname "$(which emulator)")" && ./emulator "$@"; }
おもむろにexpoをinstall
expoはlocalnetwork内の端末にアプリを反映するツール
npm install -g exp
npm install -g react-devtools
今度こそ run-android
エミュレーターは先に起動をしておかなければいけないみたい。
@以降はエミュレーターで登録した環境?名
emulator @Pixel_XL_API_26
react-native run-android
emulatorで起動できた!
Android実機で起動
実機とmacをUSBでつないで
run-android
表示されました!!