How to get a React Native project to work on M1 mac

Takuya Matsuyama - Jan 20 '21 - - Dev Community

Hi, I'm developing a multi-platform app called Inkdrop and I have an RN app of it.
I successfully got it to run on my M1 MacBook Air.
I'd like to share how I did it.

Install CocoaPods libraries using Rosetta 2

I got the following error when I ran pod install:

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-core-1.10.0/lib/cocoapods-core/cdn_source.rb:440:in `download_typhoeus_impl_async'
/Library/Ruby/Gems/2.6.0/gems/cocoapods-core-1.10.0/lib/cocoapods-core/cdn_source.rb:372:in `download_and_save_with_retries_async'
/Library/Ruby/Gems/2.6.0/gems/cocoapods-core-1.10.0/lib/cocoapods-core/cdn_source.rb:365:in `download_file_async'
/Library/Ruby/Gems/2.6.0/gems/cocoapods-core-1.10.0/lib/cocoapods-core/cdn_source.rb:338:in `download_file'
/Library/Ruby/Gems/2.6.0/gems/cocoapods-core-1.10.0/lib/cocoapods-core/cdn_source.rb:78:in `deprecated_local_podspecs'
/Library/Ruby/Gems/2.6.0/gems/cocoapods-core-1.10.0/lib/cocoapods-core/cdn_source.rb:60:in `preheat_existing_files'
/Library/Ruby/Gems/2.6.0/gems/cocoapods-core-1.10.0/lib/cocoapods-core/cdn_source.rb:257:in `update'
/Library/Ruby/Gems/2.6.0/gems/cocoapods-1.10.0/lib/cocoapods/sources_manager.rb:135:in `block (3 levels) in update'
/Library/Ruby/Gems/2.6.0/gems/cocoapods-1.10.0/lib/cocoapods/user_interface.rb:64:in `section'
/Library/Ruby/Gems/2.6.0/gems/cocoapods-1.10.0/lib/cocoapods/sources_manager.rb:134:in `block (2 levels) in update'
/Library/Ruby/Gems/2.6.0/gems/cocoapods-1.10.0/lib/cocoapods/sources_manager.rb:133:in `each'
/Library/Ruby/Gems/2.6.0/gems/cocoapods-1.10.0/lib/cocoapods/sources_manager.rb:133:in `block in update'                                                                                                                                      /Library/Ruby/Gems/2.6.0/gems/cocoapods-1.10.0/lib/cocoapods/sources_manager.rb:131:in `open'
/Library/Ruby/Gems/2.6.0/gems/cocoapods-1.10.0/lib/cocoapods/sources_manager.rb:131:in `update'
/Library/Ruby/Gems/2.6.0/gems/cocoapods-1.10.0/lib/cocoapods/installer/analyzer.rb:145:in `block in update_repositories'
/Library/Ruby/Gems/2.6.0/gems/cocoapods-1.10.0/lib/cocoapods/installer/analyzer.rb:143:in `each'
/Library/Ruby/Gems/2.6.0/gems/cocoapods-1.10.0/lib/cocoapods/installer/analyzer.rb:143:in `update_repositories'
/Library/Ruby/Gems/2.6.0/gems/cocoapods-1.10.0/lib/cocoapods/installer.rb:235:in `block in resolve_dependencies'
/Library/Ruby/Gems/2.6.0/gems/cocoapods-1.10.0/lib/cocoapods/user_interface.rb:64:in `section'
/Library/Ruby/Gems/2.6.0/gems/cocoapods-1.10.0/lib/cocoapods/installer.rb:234:in `resolve_dependencies'
/Library/Ruby/Gems/2.6.0/gems/cocoapods-1.10.0/lib/cocoapods/installer.rb:160:in `install!'
/Library/Ruby/Gems/2.6.0/gems/cocoapods-1.10.0/lib/cocoapods/command/update.rb:63: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.0/lib/cocoapods/command.rb:52:in `run'
/Library/Ruby/Gems/2.6.0/gems/cocoapods-1.10.0/bin/pod:55:in `<top (required)>'
/usr/local/bin/pod:23:in `load'
/usr/local/bin/pod:23:in `<main>'
Enter fullscreen mode Exit fullscreen mode

Here is the discussion about the issue:

It solved by doing so:

sudo arch -x86_64 gem install ffi
arch -x86_64 pod install
Enter fullscreen mode Exit fullscreen mode

Recompile the project on Xcode

When I compiled my project with Xcode 12, it got this error:

ld: in /Users/***/Developments/inkdrop/inkdrop-mobile/ios/Pods/OpenSSL-Universal/ios/lib/libcrypto.a(cryptlib.o), building for iOS Simulator, but linking in object file built for iOS, file '/Users/***/Developments/inkdrop/inkdrop-mobile/ios/Pods/OpenSSL-Universal/ios/lib/libcrypto.a' for architecture arm64
Enter fullscreen mode Exit fullscreen mode

This thread helped me:

For those that have been dealing with build failures like:

[some file path], building for iOS Simulator, but linking in object file built for iOS, file '[some file path]' for architecture arm64
This issue has started coming up with Xcode 12 and support for the new ARM based Macs, as arm64 now no longer can be assumed to only be for iOS devices. This means Xcode 12 will now also build for arm64 simulator SDKs and it has become ambiguous if an arch slice in a prebuilt binary is meant for a simulator or device.

So, all I had to do is change the project settings like so:

Change project settings

Don't forget to also set the flags to Pods.xcodeproj!

Update

You can make it automatically update the Pods project settings by editing Podfile:

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

Then, clear the build cache by hitting Cmd-Shift-K, then rebuild it.
And it worked!

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .