React native iOS 0.69.1 build failed when creating new project

Question

I created a new project using npx react-native init MyApp --template react-native-template-typescript and then running yarn ios I'm getting build error:

The following build commands failed:
    CompileC /Users/macbookair/Library/Developer/Xcode/DerivedData/justChat-gvlyyuoxvfahekfvnoiuaatjtplq/Build/Intermediates.noindex/Pods.build/Debug-iphonesimulator/React-Codegen.build/Objects-normal/x86_64/FBReactNativeSpec-generated.o /Users/macbookair/Desktop/justChat/ios/build/generated/ios/FBReactNativeSpec/FBReactNativeSpec-generated.mm normal x86_64 objective-c++ com.apple.compilers.llvm.clang.1_0.compiler
(1 failure)

I tried the following suggestions mentioned in this link: https://github.com/facebook/react-native/issues/24450#issuecomment-516760157 but the same error keep on coming.

And every workaround mentioned in this: React Native - npx react-native run-ios doesn't work after initializing the project

But none of them worked, I'm still stuck. I hoped that by making a new project I won't run into errors but jesus.

My config: iOS Catalina - version 10.15.7 XCode - 12.4

Package.json

{
  "version": "0.0.1",
  "private": true,
  "scripts": {
    "android": "react-native run-android",
    "ios": "react-native run-ios",
    "start": "react-native start",
    "test": "jest",
    "lint": "eslint . --ext .js,.jsx,.ts,.tsx"
  },
  "dependencies": {
    "react": "18.0.0",
    "react-native": "0.69.1"
  },
  "devDependencies": {
    "@babel/core": "^7.12.9",
    "@babel/runtime": "^7.12.5",
    "@react-native-community/eslint-config": "^2.0.0",
    "@tsconfig/react-native": "^2.0.0",
    "@types/jest": "^26.0.23",
    "@types/react-native": "^0.69.1",
    "@types/react-test-renderer": "^18.0.0",
    "@typescript-eslint/eslint-plugin": "^5.29.0",
    "@typescript-eslint/parser": "^5.29.0",
    "babel-jest": "^26.6.3",
    "eslint": "^7.32.0",
    "jest": "^26.6.3",
    "metro-react-native-babel-preset": "^0.70.3",
    "react-test-renderer": "18.0.0",
    "typescript": "^4.4.4"
  },
  "resolutions": {
    "@types/react": "^18"
  },
  "jest": {
    "preset": "react-native",
    "moduleFileExtensions": [
      "ts",
      "tsx",
      "js",
      "jsx",
      "json",
      "node"
    ]
  }
}

XCode output:

Podfile:

require_relative '../node_modules/react-native/scripts/react_native_pods'
require_relative '../node_modules/@react-native-community/cli-platform-ios/native_modules'

platform :ios, '12.4'
install! 'cocoapods', :deterministic_uuids => false

target 'justChat' do
  config = use_native_modules!

  # Flags change depending on the env values.
  flags = get_default_flags()

  use_react_native!(
    :path => config[:reactNativePath],
    # to enable hermes on iOS, change `false` to `true` and then install pods
    :hermes_enabled => flags[:hermes_enabled],
    :fabric_enabled => flags[:fabric_enabled],
    # An absolute path to your application root.
    :app_path => "#{Pod::Config.instance.installation_root}/.."
  )

  target 'justChatTests' do
    inherit! :complete
    # Pods for testing
  end

  # Enables Flipper.
  #
  # Note that if you have use_frameworks! enabled, Flipper will not work and
  # you should disable the next line.
  # use_flipper!()
  use_flipper!({ 'Flipper' => '0.151.0' })

  post_install do |installer|
    react_native_post_install(installer)

    __apply_Xcode_12_5_M1_post_install_workaround(installer)
  end
end

Any suggestions?

Full Build Log:

...
In file included from /Users/macbookair/Desktop/justChat/ios/build/generated/ios/FBReactNativeSpec/FBReactNativeSpec-generated.mm:14:
/Users/macbookair/Desktop/justChat/ios/build/generated/ios/FBReactNativeSpec/FBReactNativeSpec.h:2206:46: error: 'value' is unavailable: introduced in iOS 12.0
  d[@"window"] = window.has_value() ? window.value().buildUnsafeRawValue() : nil;
                                             ^
In file included from /Users/macbookair/Desktop/justChat/ios/build/generated/ios/FBReactNativeSpec/FBReactNativeSpec-generated.mm:14:
In file included from /Users/macbookair/Desktop/justChat/ios/build/generated/ios/FBReactNativeSpec/FBReactNativeSpec.h:19:
In file included from /Users/macbookair/Desktop/justChat/ios/Pods/Headers/Public/RCTTypeSafety/RCTTypeSafety/RCTConvertHelpers.h:8:
/Applications/Xcode.app/Contents/Developer/Toolchains/XcodeDefault.xctoolchain/usr/bin/../include/c++/v1/optional:953:27: note: 'value' has been explicitly marked unavailable here
    constexpr value_type& value() &
                          ^
In file included from /Users/macbookair/Desktop/justChat/ios/build/generated/ios/FBReactNativeSpec/FBReactNativeSpec-generated.mm:14:
/Users/macbookair/Desktop/justChat/ios/build/generated/ios/FBReactNativeSpec/FBReactNativeSpec.h:2208:46: error: 'value' is unavailable: introduced in iOS 12.0
  d[@"screen"] = screen.has_value() ? screen.value().buildUnsafeRawValue() : nil;
                                             ^
In file included from /Users/macbookair/Desktop/justChat/ios/build/generated/ios/FBReactNativeSpec/FBReactNativeSpec-generated.mm:14:
In file included from /Users/macbookair/Desktop/justChat/ios/build/generated/ios/FBReactNativeSpec/FBReactNativeSpec.h:19:
In file included from /Users/macbookair/Desktop/justChat/ios/Pods/Headers/Public/RCTTypeSafety/RCTTypeSafety/RCTConvertHelpers.h:8:
/Applications/Xcode.app/Contents/Developer/Toolchains/XcodeDefault.xctoolchain/usr/bin/../include/c++/v1/optional:953:27: note: 'value' has been explicitly marked unavailable here
    constexpr value_type& value() &
                          ^
In file included from /Users/macbookair/Desktop/justChat/ios/build/generated/ios/FBReactNativeSpec/FBReactNativeSpec-generated.mm:14:
/Users/macbookair/Desktop/justChat/ios/build/generated/ios/FBReactNativeSpec/FBReactNativeSpec.h:2210:88: error: 'value' is unavailable: introduced in iOS 12.0
  d[@"windowPhysicalPixels"] = windowPhysicalPixels.has_value() ? windowPhysicalPixels.value().buildUnsafeRawValue() : nil;
                                                                                       ^
In file included from /Users/macbookair/Desktop/justChat/ios/build/generated/ios/FBReactNativeSpec/FBReactNativeSpec-generated.mm:14:
In file included from /Users/macbookair/Desktop/justChat/ios/build/generated/ios/FBReactNativeSpec/FBReactNativeSpec.h:19:
In file included from /Users/macbookair/Desktop/justChat/ios/Pods/Headers/Public/RCTTypeSafety/RCTTypeSafety/RCTConvertHelpers.h:8:
/Applications/Xcode.app/Contents/Developer/Toolchains/XcodeDefault.xctoolchain/usr/bin/../include/c++/v1/optional:953:27: note: 'value' has been explicitly marked unavailable here
    constexpr value_type& value() &
                          ^
In file included from /Users/macbookair/Desktop/justChat/ios/build/generated/ios/FBReactNativeSpec/FBReactNativeSpec-generated.mm:14:
/Users/macbookair/Desktop/justChat/ios/build/generated/ios/FBReactNativeSpec/FBReactNativeSpec.h:2212:88: error: 'value' is unavailable: introduced in iOS 12.0
  d[@"screenPhysicalPixels"] = screenPhysicalPixels.has_value() ? screenPhysicalPixels.value().buildUnsafeRawValue() : nil;
                                                                                       ^
In file included from /Users/macbookair/Desktop/justChat/ios/build/generated/ios/FBReactNativeSpec/FBReactNativeSpec-generated.mm:14:
In file included from /Users/macbookair/Desktop/justChat/ios/build/generated/ios/FBReactNativeSpec/FBReactNativeSpec.h:19:
In file included from /Users/macbookair/Desktop/justChat/ios/Pods/Headers/Public/RCTTypeSafety/RCTTypeSafety/RCTConvertHelpers.h:8:
/Applications/Xcode.app/Contents/Developer/Toolchains/XcodeDefault.xctoolchain/usr/bin/../include/c++/v1/optional:953:27: note: 'value' has been explicitly marked unavailable here
    constexpr value_type& value() &
                          ^
In file included from /Users/macbookair/Desktop/justChat/ios/build/generated/ios/FBReactNativeSpec/FBReactNativeSpec-generated.mm:14:
/Users/macbookair/Desktop/justChat/ios/build/generated/ios/FBReactNativeSpec/FBReactNativeSpec.h:2223:96: error: 'value' is unavailable: introduced in iOS 12.0
  d[@"isIPhoneX_deprecated"] = isIPhoneX_deprecated.has_value() ? @((BOOL)isIPhoneX_deprecated.value()) : nil;
                                                                                               ^
In file included from /Users/macbookair/Desktop/justChat/ios/build/generated/ios/FBReactNativeSpec/FBReactNativeSpec-generated.mm:14:
In file included from /Users/macbookair/Desktop/justChat/ios/build/generated/ios/FBReactNativeSpec/FBReactNativeSpec.h:19:
In file included from /Users/macbookair/Desktop/justChat/ios/Pods/Headers/Public/RCTTypeSafety/RCTTypeSafety/RCTConvertHelpers.h:8:
/Applications/Xcode.app/Contents/Developer/Toolchains/XcodeDefault.xctoolchain/usr/bin/../include/c++/v1/optional:953:27: note: 'value' has been explicitly marked unavailable here
    constexpr value_type& value() &
                          ^
In file included from /Users/macbookair/Desktop/justChat/ios/build/generated/ios/FBReactNativeSpec/FBReactNativeSpec-generated.mm:14:
/Users/macbookair/Desktop/justChat/ios/build/generated/ios/FBReactNativeSpec/FBReactNativeSpec.h:2462:68: error: 'value' is unavailable: introduced in iOS 12.0
  d[@"prerelease"] = prerelease.has_value() ? @((double)prerelease.value()) : nil;
                                                                   ^
In file included from /Users/macbookair/Desktop/justChat/ios/build/generated/ios/FBReactNativeSpec/FBReactNativeSpec-generated.mm:14:
In file included from /Users/macbookair/Desktop/justChat/ios/build/generated/ios/FBReactNativeSpec/FBReactNativeSpec.h:19:
In file included from /Users/macbookair/Desktop/justChat/ios/Pods/Headers/Public/RCTTypeSafety/RCTTypeSafety/RCTConvertHelpers.h:8:
/Applications/Xcode.app/Contents/Developer/Toolchains/XcodeDefault.xctoolchain/usr/bin/../include/c++/v1/optional:953:27: note: 'value' has been explicitly marked unavailable here
    constexpr value_type& value() &
                          ^
In file included from /Users/macbookair/Desktop/justChat/ios/build/generated/ios/FBReactNativeSpec/FBReactNativeSpec-generated.mm:14:
/Users/macbookair/Desktop/justChat/ios/build/generated/ios/FBReactNativeSpec/FBReactNativeSpec.h:2588:110: error: 'value' is unavailable: introduced in iOS 12.0
  d[@"DEFAULT_BACKGROUND_COLOR"] = DEFAULT_BACKGROUND_COLOR.has_value() ? @((double)DEFAULT_BACKGROUND_COLOR.value()) : nil;
                                                                                                             ^
In file included from /Users/macbookair/Desktop/justChat/ios/build/generated/ios/FBReactNativeSpec/FBReactNativeSpec-generated.mm:14:
In file included from /Users/macbookair/Desktop/justChat/ios/build/generated/ios/FBReactNativeSpec/FBReactNativeSpec.h:19:
In file included from /Users/macbookair/Desktop/justChat/ios/Pods/Headers/Public/RCTTypeSafety/RCTTypeSafety/RCTConvertHelpers.h:8:
/Applications/Xcode.app/Contents/Developer/Toolchains/XcodeDefault.xctoolchain/usr/bin/../include/c++/v1/optional:953:27: note: 'value' has been explicitly marked unavailable here
    constexpr value_type& value() &
                          ^
7 errors generated.


** BUILD FAILED **


The following build commands failed:
    CompileC /Users/macbookair/Library/Developer/Xcode/DerivedData/justChat-gvlyyuoxvfahekfvnoiuaatjtplq/Build/Intermediates.noindex/Pods.build/Debug-iphonesimulator/React-Codegen.build/Objects-normal/x86_64/FBReactNativeSpec-generated.o /Users/macbookair/Desktop/justChat/ios/build/generated/ios/FBReactNativeSpec/FBReactNativeSpec-generated.mm normal x86_64 objective-c++ com.apple.compilers.llvm.clang.1_0.compiler
(1 failure)

Answer 1

Looks like the pods from RN/FB are targeting deployment target 11.0, try to add this at the end of your Podfile so it will use the app's deployment target instead for all pods (except RCT-Folly which has to stay at 9.0 or it throw another error):

deployment_target = Gem::Version.new('12.4')
platform :ios, deployment_target

# ...

post_install do |installer|
  react_native_post_install(installer)
  # Uncomment if using a M1 Mac with XCode 12.5
  # __apply_Xcode_12_5_M1_post_install_workaround(installer)

  # target -> https://www.rubydoc.info/gems/xcodeproj/Xcodeproj/Project/Object/PBXNativeTarget
  installer.pods_project.targets.each do |target|
    case target.name
    # Ignore RCT-Folly because it only works with 9.0 as a deployment target
    when 'RCT-Folly'
      next
    else
      # Explicitly set pods deployment target for each build config to app deployment target
      target.build_configurations.each do |config|
        current_pod_target = config.build_settings['IPHONEOS_DEPLOYMENT_TARGET']
        pod_ios_deployment_target = Gem::Version.new(current_pod_target)
        if pod_ios_deployment_target <= deployment_target
          config.build_settings.delete 'IPHONEOS_DEPLOYMENT_TARGET'
        end
      end
    end
  end
end