M1 MacにおけるReact Nativeのセットアップ

いくつか世の中に出ているセットアップ方法を無心にたどると失敗する。

rubyは結構罠があり、rbenv等を経由してruby-buildを利用する方法は、ビルドを通すのが困難でできてもpod installで失敗する。※2022/12/02現在

system側のrubyにライブラリを追加して、`pod install`する方針だとうまくいった。

# 環境
- react-native
  - 0.66.1
- nodejs
  - 14.17.1
- java
  - zulu-11.60.19
- ruby
  - system(ruby 2.6.10p210)
- パッケージ管理
  - asdf

# Homebrewのインストール
x86, arm版それぞれインストールしておく

```
# Rosettaをインストール
sudo softwareupdate --install-rosetta

# x86_64版のhomebrewをインストール
arch -x86_64 /bin/bash -c "$(curl -fsSL <https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh>)"

# ARM版
arch -arm64e /bin/bash -c "$(curl -fsSL <https://raw.githubusercontent.com/Homebrew/install/master/install.sh>)"
```

## 設定

ARM版を優先

~/.zshrcに追記
```bash
typeset -U path PATH
path=(
	/opt/homebrew/bin(N-/)
	/usr/local/bin(N-/)
	$path
)
```

# asdfをインストール

```bash
brew install gpg gawk
brew install asdf

# zshrcに設定を追記
echo -e "\\n. $(brew --prefix asdf)/libexec/asdf.sh" >> ${ZDOTDIR:-~}/.zshrc

# direnvのプラグインもインストール
asdf plugin-add direnv
asdf direnv setup --shell zsh --version latest
```

設定ファイルを設置


~/.asdfrc

```bash
legacy_version_file = yes
```

プロジェクトフォルダのルートに設定ファイルを設置

.envrc

```bash
use asdf

PATH_add bin ./node_modules/.bin

dotenv
```

.tool-versions

```bash
nodejs 14.17.1
java zulu-11.60.19
ruby system
```

# 関連ツールをインストール

```bash
brew install cocoapods
```

# nodeのインストール

```
asdf plugin add nodejs
asdf install nodejs 14.17.1
```

# Rubyのセットアップ

rvm, ruby-buildしたrubyを利用するとハマるのでシステムインストールされているrubyを利用する方針で進める。

```bash
# ビルド中エラーが出るようなら、下記のようにシンボリックリンクを貼って試してみてください
arch -x86_64 sudo gem install ffi -v '1.12.2'

# バージョンでパスが変わるので適宜合わせてください
cd /Applications/Xcode.app/Contents/Developer/Platforms/MacOSX.platform/Developer/SDKs/MacOSX13.sdk/System/Library/Frameworks/Ruby.framework/Versions/2.6/usr/include/ruby-2.6.0/ruby/
sudo ln -sf ../../../../Headers/ruby/config.h

cd /Applications/Xcode.app/Contents/Developer/Platforms/MacOSX.platform/Developer/SDKs/MacOSX13.sdk/System/Library/Frameworks/Ruby.framework/Versions/2.6/usr/include/ruby-2.6.0
sudo ln -sf universal-darwin22 universal-darwin21

# もっかいトライ
arch -x86_64 sudo gem install ffi -v '1.12.2'
arch -x86_64 sudo gem install cocoapods

bundle install --path vendor/bundle

# うまく行ったらpodもインストール
cd ios
pod install
```

# iOSのビルド確認

```bash
react-native run-ios
```

# Javaのインストール

```bash
# java
brew tap homebrew/cask-versions
brew install --cask zulu11
brew install maven
asdf plugin-add java https://github.com/halcyon/asdf-java.git
asdf install java adoptopenjdk-11
```

設定ファイルも設置

.zshrc

```bash
# zsh
. ~/.asdf/plugins/java/set-java-home.zsh
```

.bashrc

```bash
# bash
. ~/.asdf/plugins/java/set-java-home.bash
```

# Android Studioの設定

## Gradle JDKをzulu-11に設定

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3442/c8816293-5535-e7ba-f1d5-89723c21e995.png)

## Android SDKとか色々インストール

検証しないまま適当に入れた
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3442/9ee4c156-9aac-e5d1-eb90-31a5f11beb0e.png)




# androidのビルド確認

```bash
# これでできるはず
react-native run-android
```

# 参考

- みんなの M1 Mac における Homebrew のベストプラクティス は間違っている
[https://zenn.dev/ress/articles/069baf1c305523dfca3d](https://zenn.dev/ress/articles/069baf1c305523dfca3d)
- bundle installに失敗してから解決するまで [https://zenn.dev/nemototea/scraps/01bc0d32a855c7](https://zenn.dev/nemototea/scraps/01bc0d32a855c7)
- vim - macOS Mojave 'ruby/config.h' file not found - Stack Overflow [https://stackoverflow.com/questions/53135863/macos-mojave-ruby-config-h-file-not-found](https://stackoverflow.com/questions/53135863/macos-mojave-ruby-config-h-file-not-found)
- M1でReactNativeのセットアップ備忘録（2021/12） [https://zenn.dev/hisasann/articles/m1-react-native-setup](https://zenn.dev/hisasann/articles/m1-react-native-setup)
- android studio - First React Native App: Task :app:processDebugMainManifest FAILED - Stack Overflow [https://stackoverflow.com/questions/66696339/first-react-native-app-task-appprocessdebugmainmanifest-failed](https://stackoverflow.com/questions/66696339/first-react-native-app-task-appprocessdebugmainmanifest-failed)
- [FIXED] Android build failures \`No matching variant of com.facebook.react:react-native:0.71.0-rc.0 was found.\` · Issue #35210 · facebook/react-native [https://github.com/facebook/react-native/issues/35210](https://github.com/facebook/react-native/issues/35210)
- Unity2018でAndroid12ビルド対応 - Qiita [https://qiita.com/owenc4a4/items/b4430f3eadb25e87fc84](https://qiita.com/owenc4a4/items/b4430f3eadb25e87fc84)