Notes

Setting up an M1 MacBook Pro for React Native (iOS and Android)

getting React Native iOS and Android builds working on an M1 MacBook Pro, with CocoaPods under Rosetta, the M1 Android emulator preview and Podfile fixes

Edit on GitHub

React Native & Expo
4 minutes

Setting up the environment

Setup for iOS needs:

  • Node (with NVM)
  • Watchman brew install watchman
  • Xcode (install from the App Store)
  • Xcode Command Line Tools xcode-select --install
  • Accept the Software License for Xcode sudo xcodebuild -license. It’ll prompt you anyway when you run Xcode for the first time.
  • CocoaPods sudo gem install cocoapods
1# node will be installed with NVM
2brew install watchman
3
4# install CocoaPods
5#sudo gem install cocoapods
6brew install cocoapods
clone the project
`npm ci`

Ruby

Install Ruby 3.x. The one that comes pre-installed with macOS is outdated

1brew install ruby

Cocoapods

1# sudo gem uninstall cocoapods
2
3# if you get error: You don't have write permissions for the /usr/bin directory.
4# sudo gem install cocoapods -n /usr/local/bin
5
6arch -arm64 brew install cocoapods
7
8# if you get error: rbenv: pod: command not found
9brew link --overwrite cocoapods

Homebrew

Install Homebrew if you don’t have it installed already

1mkdir homebrew && curl -L https://github.com/Homebrew/brew/tarball/master | tar xz --strip 1 -C homebrew

Node LTS with NVM

1curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.37.2/install.sh | bash
2
3export NVM_DIR="$([ -z "${XDG_CONFIG_HOME-}" ] && printf %s "${HOME}/.nvm" || printf %s "${XDG_CONFIG_HOME}/nvm")"
4[ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh" # This loads nvm
5
6nvm install --lts

iOS

  • Open Terminal / iTerm with Rosetta (Get Info > Open using Rosetta)
  • Prefix the CocoaPods related commands with arch -x86_64
1sudo gem update --system
2
3arch -x86_64 sudo gem install cocoapods
4arch -x86_64 sudo gem install ffi
1cd ios/
2arch -x86_64 pod install

Android

The Android Emulator doesn’t work out of the box yet. Luckily, there is a Preview build by Google that supports Apple Silicon M1 chip based MacBooks. You’ll have to download and install it separately. Most things work.

OpenJDK 16

 1# download tarball from OpenJDK archive (v16.0.1)
 2curl -sL https://download.java.net/java/GA/jdk16.0.1/7147401fd7354114ac51ef3e1328291f/9/GPL/openjdk-16.0.1_osx-x64_bin.tar.gz
 3
 4# move and extract in /Library/Java/JavaVirtualMachines/
 5sudo mv openjdk-16.0.1_osx-x64_bin.tar.gz /Library/Java/JavaVirtualMachines/
 6cd /Library/Java/JavaVirtualMachines/
 7sudo tar -xzf openjdk-16.0.1_osx-x64_bin.tar.gz
 8sudo rm openjdk-16.0.1_osx-x64_bin.tar.gz
 9
10# set JAVA_HOME
11echo -n "\nexport JAVA_HOME=`/usr/libexec/java_home -v16`" >> ~/.zprofile
12
13# make the changes take effect
14source ~/.zprofile
15
16# confirm install
17java -version

Troubleshooting

  • command not found for brew or nvm. Make sure you have a ~/.zshrc file. On a fresh new M1 MacBook, there is no ~/.zshrc or ~/.zprofile created and the $PATH doesn’t get updated because of it. Create a ~/.zshrc file and run the commands to install Homebrew and NVM again.
1touch ~/.zshrc
### Error

LoadError - dlopen(/Library/Ruby/Gems/2.6.0/gems/ffi-1.14.2/lib/ffi_c.bundle, 0x0009): missing compatible arch in /Library/Ruby/Gems/2.6.0/gems/ffi-1.14.2/lib/ffi_c.bundle - /Library/Ruby/Gems/2.6.0/gems/ffi-1.14.2/lib/ffi_c.bundle
/System/Library/Frameworks/Ruby.framework/Versions/2.6/usr/lib/ruby/2.6.0/rubygems/core_ext/kernel_require.rb:54:in `require'
/System/Library/Frameworks/Ruby.framework/Versions/2.6/usr/lib/ruby/2.6.0/rubygems/core_ext/kernel_require.rb:54:in `require'
/Library/Ruby/Gems/2.6.0/gems/ffi-1.14.2/lib/ffi.rb:6:in `rescue in <top (required)>'
/Library/Ruby/Gems/2.6.0/gems/ffi-1.14.2/lib/ffi.rb:3:in `<top (required)>'
/System/Library/Frameworks/Ruby.framework/Versions/2.6/usr/lib/ruby/2.6.0/rubygems/core_ext/kernel_require.rb:54:in `require'
/System/Library/Frameworks/Ruby.framework/Versions/2.6/usr/lib/ruby/2.6.0/rubygems/core_ext/kernel_require.rb:54:in `require'
/Library/Ruby/Gems/2.6.0/gems/ethon-0.12.0/lib/ethon.rb:2:in `<top (required)>'
/System/Library/Frameworks/Ruby.framework/Versions/2.6/usr/lib/ruby/2.6.0/rubygems/core_ext/kernel_require.rb:54:in `require'
/System/Library/Frameworks/Ruby.framework/Versions/2.6/usr/lib/ruby/2.6.0/rubygems/core_ext/kernel_require.rb:54:in `require'
/Library/Ruby/Gems/2.6.0/gems/typhoeus-1.4.0/lib/typhoeus.rb:2:in `<top (required)>'
/System/Library/Frameworks/Ruby.framework/Versions/2.6/usr/lib/ruby/2.6.0/rubygems/core_ext/kernel_require.rb:54:in `require'
/System/Library/Frameworks/Ruby.framework/Versions/2.6/usr/lib/ruby/2.6.0/rubygems/core_ext/kernel_require.rb:54:in `require'
/Library/Ruby/Gems/2.6.0/gems/cocoapods-1.10.1/lib/cocoapods/sources_manager.rb:74:in `cdn_url?'
/Library/Ruby/Gems/2.6.0/gems/cocoapods-1.10.1/lib/cocoapods/sources_manager.rb:36:in `create_source_with_url'
/Library/Ruby/Gems/2.6.0/gems/cocoapods-1.10.1/lib/cocoapods/sources_manager.rb:21:in `find_or_create_source_with_url'
/Library/Ruby/Gems/2.6.0/gems/cocoapods-1.10.1/lib/cocoapods/installer/analyzer.rb:178:in `block in sources'
/Library/Ruby/Gems/2.6.0/gems/cocoapods-1.10.1/lib/cocoapods/installer/analyzer.rb:177:in `map'
/Library/Ruby/Gems/2.6.0/gems/cocoapods-1.10.1/lib/cocoapods/installer/analyzer.rb:177:in `sources'
/Library/Ruby/Gems/2.6.0/gems/cocoapods-1.10.1/lib/cocoapods/installer/analyzer.rb:1073:in `block in resolve_dependencies'
/Library/Ruby/Gems/2.6.0/gems/cocoapods-1.10.1/lib/cocoapods/user_interface.rb:64:in `section'
/Library/Ruby/Gems/2.6.0/gems/cocoapods-1.10.1/lib/cocoapods/installer/analyzer.rb:1072:in `resolve_dependencies'
/Library/Ruby/Gems/2.6.0/gems/cocoapods-1.10.1/lib/cocoapods/installer/analyzer.rb:124:in `analyze'
/Library/Ruby/Gems/2.6.0/gems/cocoapods-1.10.1/lib/cocoapods/installer.rb:414:in `analyze'
/Library/Ruby/Gems/2.6.0/gems/cocoapods-1.10.1/lib/cocoapods/installer.rb:239:in `block in resolve_dependencies'
/Library/Ruby/Gems/2.6.0/gems/cocoapods-1.10.1/lib/cocoapods/user_interface.rb:64:in `section'
/Library/Ruby/Gems/2.6.0/gems/cocoapods-1.10.1/lib/cocoapods/installer.rb:238:in `resolve_dependencies'
/Library/Ruby/Gems/2.6.0/gems/cocoapods-1.10.1/lib/cocoapods/installer.rb:160:in `install!'
/Library/Ruby/Gems/2.6.0/gems/cocoapods-1.10.1/lib/cocoapods/command/install.rb:52:in `run'
/Library/Ruby/Gems/2.6.0/gems/claide-1.0.3/lib/claide/command.rb:334:in `run'
/Library/Ruby/Gems/2.6.0/gems/cocoapods-1.10.1/lib/cocoapods/command.rb:52:in `run'
/Library/Ruby/Gems/2.6.0/gems/cocoapods-1.10.1/bin/pod:55:in `<top (required)>'
/usr/local/bin/pod:23:in `load'
/usr/local/bin/pod:23:in `<main>'

――― TEMPLATE END ――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――――

[!] Oh no, an error occurred.
warning: The iOS Simulator deployment target 'IPHONEOS_DEPLOYMENT_TARGET' is set to 8.0, but the range of supported deployment target versions is 9.0 to 14.4.99. (in target 'boost-for-react-native' from project 'Pods')

Add this to you Podfile

 1post_install do |installer|
 2  # set the Deployment target for all your Pods references
 3  installer.pods_project.targets.each do |target|
 4    target.build_configurations.each do |config|
 5      # adjusting it only if it's not greater than 8.0
 6      if Gem::Version.new('9.0') > Gem::Version.new(config.build_settings['IPHONEOS_DEPLOYMENT_TARGET'])
 7        config.build_settings['IPHONEOS_DEPLOYMENT_TARGET'] = '9.0'
 8      end
 9    end
10  end
11end
error listen EADDRINUSE: address already in use :::8081. Run CLI with --verbose flag for more details.

Two options:

  • Run on a different port react-native start --port=8088
  • OR find out what program is using 8081 sudo lsof -i :8081 and kill it kill -9 1234

incorrect architecture ‘x86_64’ errors

warning: no rule to process file '/Users/aamnah/Sites/mobile-app/ios/Pods/Flipper-RSocket/rsocket/README.md' of type 'net.daringfireball.markdown' for architecture 'x86_64' (in target 'Flipper-RSocket' from project 'Pods')

add this to the Podfile

post_install do |installer|
  installer.pods_project.build_configurations.each do |config|
    config.build_settings["EXCLUDED_ARCHS[sdk=iphonesimulator*]"] = "arm64"
  end
end

run pod install afterwards

Related

Browse all topics