React-native: [iOS] Build fails with error duplicate symbols for architecture x86_64

[pedro-lb]

ExpoKit iOS build error: duplicated symbols for architecture x86_64

🐛 Bug Report

https://github.com/pedro-lb/expokit-duplicated-symbols

Details:

When trying to build the app for iOS on XCode, the following error is thrown:

ld: 90 duplicate symbols for architecture x86_64
clang: error: linker command failed with exit code 1 (use -v to see invocation)

React Native version:

pedrobini@Pedros-MacBook-Pro ios % npx react-native info                                      
info Fetching system and libraries information...

System:
    OS: macOS 10.15.2
    CPU: (8) x64 Intel(R) Core(TM) i7-4770HQ CPU @ 2.20GHz
    Memory: 1.63 GB / 16.00 GB
    Shell: 5.7.1 - /bin/zsh
  Binaries:
    Node: 12.12.0 - /usr/local/bin/node
    Yarn: 1.19.1 - /usr/local/bin/yarn
    npm: 6.11.3 - /usr/local/bin/npm
    Watchman: 4.9.0 - /usr/local/bin/watchman
  SDKs:
    iOS SDK:
      Platforms: iOS 13.2, DriverKit 19.0, macOS 10.15, tvOS 13.2, watchOS 6.1
    Android SDK:
      API Levels: 24, 25, 26, 27, 28, 29
      Build Tools: 27.0.3, 28.0.0, 28.0.3, 29.0.2
      System Images: android-29 | Google Play Intel x86 Atom
  IDEs:
    Android Studio: 3.5 AI-191.8026.42.35.5900203
    Xcode: 11.3.1/11C504 - /usr/bin/xcodebuild
  npmGlobalPackages:
    react-native-surrender: 2.0.0

Target: iOS

Steps To Reproduce

Clone our repo that reproduces the problem:

git clone https://github.com/pedro-lb/expokit-duplicated-symbols

Follow setup guide:

• Run yarn install.
• Go into ios directory and run pod install: cd ios && pod install.
• Start the expo server with yarn start --clear.

• Open the project in XCode, click Build (or hit ⌘ + B).

  You should hit the error: duplicate symbols for architecture x86_64.

Describe what you expected to happen:

The app builds successfully and works.

Snack, code example, screenshot, or link to a repository:

https://github.com/pedro-lb/expokit-duplicated-symbols

Solutions already attempted:

We've tried a few fixes as listed below.

❌ Upgrading to XCode 10's new build system:

Yeah, we're late to the party and still using the old build system. Although when trying to use the new one, the same error still happens and it doesn't build.

ld: 90 duplicate symbols for architecture x86_64
clang: error: linker command failed with exit code 1 (use -v to see invocation)

❌ Manually removing conflics in Podfile:

We've tried to manually remove conflicting links on a post-install hook in our Podfile. The script looks as below.

The links were removed but that solution does not work. Same error happens (duplicate symbols for architecture x86_64).

post_install do |installer|
  installer.pods_project.targets.each do |target|
    if %w(RNScreens RNCMaskedView react-native-safe-area-context).include?(target.name)
      target.remove_from_project
    end
  end
end

❌ Disabling autolink for conflicting dependencies on react-native.config.js:

By disabling React Native's autolink for the conflicting dependencies in react-native.config.js file, the project still does not build, and a new error appears.

module.exports = {
  dependencies: {
    ...,
    '@react-native-community/masked-view': {
      platforms: {
        ios: null,
      },
    },
    'react-native-safe-area-context': {
      platforms: {
        ios: null,
      },
    },
    'react-native-screens': {
      platforms: {
        ios: null,
      },
    },
  },
};

A new error happens when trying to build:

ld: library not found for -lRNCMaskedView
clang: error: linker command failed with exit code 1 (use -v to see invocation)

❌ Removing conflicting dependencies from package.json:

By removing the conflicting dependencies below from package.json and re-installing our modules and pods (by running the commands below).

yarn remove @react-native-community/masked-view react-native-screens react-native-safe-area-context

rm -rf node_modules yarn.lock

yarn install

cd ios

rm -rf Podfile.lock Pods

pod install

> build on XCode

On this repository, the project builds and works correctly! But I guess this happens since we don't really use these dependencies here (they were just installed via yarn add). On our project another error happens during build, since we actually import and use these dependencies:

ld: library not found for -lRNCMaskedView
clang: error: linker command failed with exit code 1 (use -v to see invocation)

❌ Tinkering with XCode build settings:

We've tried to change a few XCode build settings as mentioned in a few Stack Overflow posts, but none of them worked.

• ❗ Removing -ObjC flag Other Linker Flags in XCode Build Settings: It builds! But doesn't work as stated in its topic below.
• 😵 Setting No Common Blocks to NO under Build Settings.
• 😵 Setting Enable Testability to NO under Build Settings.
• 😵 Running in production and debug modes.
• 😵 Removing Link Binary with Libraries under Build Phases.
• 😵 Removing duplicated (there were none) items in Compile Sources under Build Phases.
• 😵 Removing duplicated (there were none) libraries in Libraries folder in XCode.

❓ Removing -ObjC flag in Other Linker Flags under XCode's Build Settings:

By removing -ObjC flag from Other Linker Flags (located in Build Settings) on XCode, the project builds!

...but it immediately force-closes after opening 😞. The error below pops up.

*** Terminating app due to uncaught exception 'NSInvalidArgumentException', reason: '-[RCTRootView setReactTag:]: unrecognized selector sent to instance 0x7f84f6e10f40'
terminating with uncaught exception of type NSException
abort() called
CoreSimulator 681.17.2 - Device: iPhone 11 (0974E59B-9AA8-4E0B-915D-A083AB917955) - Runtime: iOS 13.3 (17C45) - DeviceType: iPhone 11

When looking at the exception that caused the app to crash with Mac OS console:

2020-01-17 14:35:13.414 [info][tid:main][RCTBridge.m:145] Class EXDisabledRedBox was not exported. Did you forget to use RCT_EXPORT_MODULE()?

Apparently, -ObjC is necessary to correctly build all the dependencies.

❌ Add React dependencies to Podfile:

When seeing the error above, while still without -ObjC flag in Other Linker Flags under XCode's Build Settings, we've tried adding the missing pods as described above (Did you forget to use RCT_EXPORT_MODULE()?) in our Podfile:

  pod 'React', :path => '../node_modules/react-native/'
  pod 'React-Core', :path => '../node_modules/react-native/React'
  pod 'React-DevSupport', :path => '../node_modules/react-native/React'
  pod 'React-fishhook', :path => '../node_modules/react-native/Libraries/fishhook'
  pod 'React-RCTActionSheet', :path => '../node_modules/react-native/Libraries/ActionSheetIOS'
  pod 'React-RCTAnimation', :path => '../node_modules/react-native/Libraries/NativeAnimation'
  pod 'React-RCTBlob', :path => '../node_modules/react-native/Libraries/Blob'
  pod 'React-RCTImage', :path => '../node_modules/react-native/Libraries/Image'
  pod 'React-RCTLinking', :path => '../node_modules/react-native/Libraries/LinkingIOS'
  pod 'React-RCTNetwork', :path => '../node_modules/react-native/Libraries/Network'
  pod 'React-RCTSettings', :path => '../node_modules/react-native/Libraries/Settings'
  pod 'React-RCTText', :path => '../node_modules/react-native/Libraries/Text'
  pod 'React-RCTVibration', :path => '../node_modules/react-native/Libraries/Vibration'
  pod 'React-RCTWebSocket', :path => '../node_modules/react-native/Libraries/WebSocket'

and we've also tried with:

pod 'React',
    :path => "../node_modules/react-native",
    :inhibit_warnings => true,
    :subspecs => [
      "Core",
      "ART",
      "RCTActionSheet",
      "RCTAnimation",
      "RCTCameraRoll",
      "RCTGeolocation",
      "RCTImage",
      "RCTNetwork",
      "RCTText",
      "RCTVibration",
      "RCTWebSocket",
      "DevSupport",
      "CxxBridge"
    ]

After running rm -rf Podfile.lock Pods && pod install, we've tried to build, but the same error happens.

2020-01-17 14:35:13.414 [info][tid:main][RCTBridge.m:145] Class EXDisabledRedBox was not exported. Did you forget to use RCT_EXPORT_MODULE()?

[gabrielnaoto]

I'm having this issue as well!

[LeoLeiteSC]

HELP

[hramos]

Have you reached out to Expo yet?

[pedro-lb]

Hey @hramos, thanks for your response!

I did, currently waiting for a response.

https://github.com/expo/expo/issues/6832.

[no-response[bot]]

It's been three weeks since we asked for additional information from the author of this issue. As it happens, we don't have enough information to take action. We are going to close this issue, but please do not hesitate to open a new issue if you are still encountering this problem.

[pedro-lb]

Still having the same issue, this shouldn't be closed!

[pdorney]

Also having this issue

[Priyatham51]

this helped me

rm -rf node_modules

cd ios

rm -rf Podfile.lock Pods

removed derived data

Quit Xcode

cd ..

npm install

cd ios 

pod install

run the project from XCODE

[pedro-lb]

@pdorney can you share more information here so we can identify the problem?

[pedro-lb]

@Priyatham51 thanks! already tried this, but it doesn't work

[mstankov]

@pedro-lb Pedro, any luck? I'm stuck on the same issue and nothing seems to resolve it. Happened after upgrading from 0.61.5 to 0.62.2.... super frustrating. Been stuck on it for 2 days now

[pedro-lb]

Hey @mstankov !

Fortunately we've been able to solve the issue! 💯

To solve this you're going to need to modify files inside your node_modules folder.

1. Identifying conflicted libs

First, you need to identify which libs are conflicting - you can do this by checking the error details in XCode. In our case, these libs were generating conflicts:

• react-native-screens
• @react-native-community/masked-view
  
  
  
  • react-native-safe-area-context
  
  

2. Patching errors

Next up you'll need to patch some module files.

• Open the file /node_modules/@react-native-community/cli-platform-ios/native_modules.rb

• Find this line:

packages.each do |package_name, package|

• Modify it as described here. You'll need to add every line that's marked with a + (obviously, remove the +).

packages.each do |package_name, package|
+
+  # PATCH TO DISABLE CONFLICTING MODULES (duplicate symbols)
+  puts ">> package_name #{package_name}"
+
+  next if %w(
+    react-native-screens 
+    @react-native-community/masked-view 
+    react-native-safe-area-context
+    # ADD ANY MORE CONFLICTING DEPENDENCIES HERE
+    # OR REMOVE THE DEPS ABOVE IF THEY ARE NOT CONFLICTING
+  ).include(package_name)
+
+  # PATCH END

3. Update dependencies

• In your ios folder, delete Podfile.lock file and Pods folder.

rm -rf Podfile.lock Pods/

• Reinstall your pods

pod install

4. Rebuild the project in XCode

• First, clear your build folder in XCode. You can do this by pressing Command + Shift + K.

• Then, build your project.

Should build normally! 🚀

5. Improving your experience with patch-package

Since it's necessary to add a change to a file inside node_modules folder, every developer will have to apply this, and even worse, you'll have to redo all of this if you re-install your dependencies (running yarn install or npm install).

We're going to use patch-package to create a patch so that this is applied automatically every time you or any other developer install any dependency, so that it's not necessary to redo this every time! This is also going to validate if our patch is still valid when updating libs.

• Follow the setup at patch-package to get started.

• Install patch-package

yarn add patch-package

• Add the patch-package hook in your package.json scripts

In package.json

"scripts": {
+  "postinstall": "patch-package"
 }

• Since we've already modified the file at node_modules, simply run the command below to create a patch.

npx patch-package @react-native-community/cli-platform-ios

Then commit the patch to your repo.

git add .
git commit -m "Patch iOS build"

---

Done!

Your build should work normally now in iOS and every developer should be able to build your repo without fiddling with node_modules files.

If you have any problems please let me know and we'll sort it out.

Cheers!

[mstankov]

@pedro-lb you're a lifesaver, thank you

[pedro-lb]

No problems!

I'll close this for now since it's been resolved.

[syphertech]

These steps worked for me

1. Delete node_modules folder
2. Delete package.lock.json
3. Delete Podfile.lock from the iOS folder
4. run npm install command from the project folder
5. cd to the iOS folder and run pod install

[ravi0the0sun]

hi @pedro-lb i followed your steps till step 3 where after updating the native-modules.rb with

# PATCH TO DISABLE CONFLICTING MODULES (duplicate symbols)
    puts ">> package_name #{package_name}"

    next if %w(
      react-native-tcp
      # ADD ANY MORE CONFLICTING DEPENDENCIES HERE
      # OR REMOVE THE DEPS ABOVE IF THEY ARE NOT CONFLICTING
    ).include(package_name)

    # PATCH END

the pod install comes with error of

➜  wepico npx pod-install
npx: installed 1 in 1.177s
Scanning for pods...
1.10.0
> pod install
>> package_name @react-native-community/async-storage

[!] Invalid `Podfile` file: undefined method `include' for #<Array:0x00007f90e60a0dd8>
Did you mean?  include?.

 #  from /Users/ravi/study/wepico/ios/Podfile:7
 #  -------------------------------------------
 #  target 'wepico' do
 >    config = use_native_modules!
 #  
 #  -------------------------------------------

Aborting run
An unexpected error was encountered. Please report it as a bug:
Error
    at CocoaPodsPackageManager._installAsync (/Users/ravi/.npm/_npx/25609/lib/node_modules/pod-install/build/index.js:2:85721)
    at processTicksAndRejections (internal/process/task_queues.js:93:5)
    at async CocoaPodsPackageManager.installAsync (/Users/ravi/.npm/_npx/25609/lib/node_modules/pod-install/build/index.js:2:85121)
    at async runAsync (/Users/ravi/.npm/_npx/25609/lib/node_modules/pod-install/build/index.js:2:12925)
    at async /Users/ravi/.npm/_npx/25609/lib/node_modules/pod-install/build/index.js:2:13011