Building React native fail on iOS - using Apple M1 chip

Question

I've got a new mac and I followed the instructions for the installation.

when I run the Command:

npx react-native init ProjectName

I got the following Error

** BUILD FAILED **

The following build commands failed: CompileC /Users/aghiadmonier/Library/Developer/Xcode/DerivedData/test- bbpkvpircnzzukgpgaaohkixdojw/Build/Intermediates.noindex/Pods.build/Debug-iphonesimulator/Flipper.build/Objects-normal/x86_64/ConnectionContextStore.o /Users/aghiadmonier/Desktop/React/test/ios/Pods/Flipper/xplat/Flipper/ConnectionContextStore.cpp normal x86_64 c++ com.apple.compilers.llvm.clang.1_0.compiler (1 failure)

I am using Xcode 12.5

Ats

checkout the link solution click its working – Compo

Answer 1

xCode 12.5 is the problem here. It seems to break react-native builds. Solutions are mentioned here - https://github.com/facebook/react-native/issues/31179#issuecomment-830184757

looks like you're on react-native 0.64

1. update podfile to use

use_flipper!('Flipper' => '0.75.1', 'Flipper-Folly' => '2.5.3')

2. update package.json to use

"react-native": "facebook/react-native#cf8a364767df830d7255339741350bb53ab1a68a"

3. run npm install (or yarn)
4. run pod install in the ios folder, clean and rebuild app

Hyperemia

Using use_flipper!('Flipper' => '0.75.1', 'Flipper-Folly' => '2.5.3') gives the following error: [!] Invalid `Podfile` file: unknown keywords: "Flipper", "Flipper-Folly". # from /Users/.../ios/Podfile:24 # ------------------------------------------- # # you should disable the next line. > use_flipper!('Flipper' => '0.75.1', 'Flipper-Folly' => '2.5.3') # # ------------------------------------------- @Hyperemia do you have any other suggestions? – Otho

Answer 2

just for the information I am using Mac M1 ship,

when I execute the Flipper command I got this error:

[!] Invalid `Podfile` file: unknown keywords: "Flipper", "Flipper-Folly".

 #  from /Users/aghiadmonier/Public/Projects/Awsom/ios/Podfile:24
 #  -------------------------------------------

you should disable the next line.

use_flipper!('Flipper' => '0.75.1', 'Flipper-Folly' => '2.5.3')

Ats

were you able to resolve this? I'm running on an M1 Mac and I'm still getting this issue with "react-native": "0.64.1" – Otho

Change the code use_flipper!('Flipper' => '0.75.1', 'Flipper-Folly' => '2.5.3')' into this use_flipper!({'Flipper' => '0.75.1', 'Flipper-Folly' => '2.5.3'})` It works on my m1 mac. – Maxwellmaxy

Answer 3

When you try to create a project using the below command in M1(Apple Silicon Chip):

npx react-native init ProjectName

Try to build using below steps:

1. Open Terminal and install rosetta
2. Type "softwareupdate — install-rosetta" command in your terminal.
3. After installation completes, go to the Application.
4. Find Terminal App
5. Right click and make a Duplicate Terminal Rosetta checkbox in terminal
6. Now right click on a duplicate terminal and click on "Get Info"
7. You will see checkbox with option "Open with Rosetta". Enable it.
8. That's it. Rename your rosetta terminal so that you can identify it easily.
9. Open your Rosetta Terminal and run the command npx react-native init ProjectName
10. After project initialisation done type npx react-native start to start metro.
11. Now type command npx react-native run-android for run into Android
12. Type command npx react-native run-ios for run into iOS.
13. After project initialisation is done you can run start and run command in VS Code also.

Demodulator

Since the same is recommended for Xcode for the moment, I don't see why you got a downvote. We got our application running with Xcode by opening it with Rosetta. We then couldn't launch our app in the terminal for the very same reason we couldn't on Xcode (some dependencies not yet compatible with M1). Running the terminal with Rosetta fixed it. – Taimi

Answer 4

just update your Podfile like this

 use_flipper!({ 'Flipper' => '0.91.1', 'Flipper-Folly' => '~> 2.6', 'Flipper-RSocket' => '~> 1.4' })

  post_install do |installer|
    installer.pods_project.targets.each do |target|
      target.build_configurations.each do |config|
        config.build_settings["ONLY_ACTIVE_ARCH"] = "NO"
      end
    end
    flipper_post_install(installer)
    react_native_post_install(installer)
  end

and after run pod install

Toulouse