Build failed: 'react/renderer/components/view/ViewProps.h' file not found

[Iamivan1996]

Issue

I am going to upgrade my personal React Native project to version 0.76.0 to conduct a health check and see if most of the common libraries are compatible with the latest version. Found out there is an issue when building the Android App

---

Error Message

In file included from node_modules/react-native-safe-area-context/common/cpp/react/renderer/components/safeareacontext/RNCSafeAreaViewState.h:3:
node_modules/react-native-safe-area-context/android/src/main/jni/../../../build/generated/source/codegen/jni/react/renderer/components/safeareacontext/Props.h:12:10: fatal error: 'react/renderer/components/view/ViewProps.h' file not found
#include <react/renderer/components/view/ViewProps.h>
^~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

In file included from node_modules/react-native-safe-area-context/common/cpp/react/renderer/components/safeareacontext/RNCSafeAreaViewShadowNode.cpp:1:
In file included from node_modules/react-native-safe-area-context/common/cpp/react/renderer/components/safeareacontext/RNCSafeAreaViewShadowNode.h:4:
node_modules/react-native-safe-area-context/android/src/main/jni/../../../build/generated/source/codegen/jni/react/renderer/components/safeareacontext/EventEmitters.h:12:10: fatal error: 'react/renderer/components/view/ViewEventEmitter.h' file not found
#include <react/renderer/components/view/ViewEventEmitter.h>
^~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

---

Dependencies

"react-native": "0.76.0",
"react-native-safe-area-context": "^4.11.1"

[Rohit3523]

Getting the same error

[abdullah-tsx]

+1

[Rohit3523]

They have an active PR, #538

I hope it get merged asap

[gautamsamyak]

Getting the same error.

[iM-GeeKy]

Here is a patch using patch-package as a temporary workaround.

diff --git a/node_modules/react-native-safe-area-context/android/src/main/jni/CMakeLists.txt b/node_modules/react-native-safe-area-context/android/src/main/jni/CMakeLists.txt
index 4ee1c8f..9a76ec3 100644
--- a/node_modules/react-native-safe-area-context/android/src/main/jni/CMakeLists.txt
+++ b/node_modules/react-native-safe-area-context/android/src/main/jni/CMakeLists.txt
@@ -37,25 +37,37 @@ target_include_directories(
   ${LIB_ANDROID_GENERATED_COMPONENTS_DIR}
 )
 
-target_link_libraries(
-  ${LIB_TARGET_NAME}
-  fbjni
-  folly_runtime
-  glog
-  jsi
-  react_codegen_rncore
-  react_debug
-  react_nativemodule_core
-  react_render_core
-  react_render_debug
-  react_render_graphics
-  react_render_mapbuffer
-  react_render_componentregistry
-  react_utils
-  rrc_view
-  turbomodulejsijni
-  yoga
-)
+# https://github.com/react-native-community/discussions-and-proposals/discussions/816
+# This if-then-else can be removed once this library does not support version below 0.76
+if (REACTNATIVE_MERGED_SO)
+  target_link_libraries(
+          ${LIB_TARGET_NAME}
+          fbjni
+          jsi
+          reactnative
+  )
+else()
+  target_link_libraries(
+          ${LIB_TARGET_NAME}
+          fbjni
+          folly_runtime
+          glog
+          jsi
+          react_codegen_rncore
+          react_debug
+          react_nativemodule_core
+          react_render_core
+          react_render_debug
+          react_render_graphics
+          react_render_mapbuffer
+          react_render_componentregistry
+          react_utils
+          rrc_view
+          turbomodulejsijni
+          yoga
+  )
+endif()
+
 
 target_compile_options(
   ${LIB_TARGET_NAME}

[akuul]

You can use old architecture for the time being until PR is merged.

[mickyfazler]

i actually wanted to open a issue but i was very afraid because i never did and also thinking will this problem be solved or not. but such an active and amazing community . I don't know is it appropriate place to say it or not but i can't stop. LOVE you guys

[sujathasperi2022]

Which version should I use? i tried 4.11.1 got this error.
tried 4.10.0 as well
any idea anyone?

[Rohit3523]

Which version should I use? i tried 4.11.1 got this error. tried 4.10.0 as well any idea anyone?

Use the latest version and create a patch for it using patch-package library

#539 (comment)

Use this code in the patch file

[sujathasperi2022]

Which version should I use? i tried 4.11.1 got this error. tried 4.10.0 as well any idea anyone?

Use the latest version and create a patch for it using patch-package library

#539 (comment)

Use this code in the patch file

which file ViewProps.h?

[craiganderson-iotv]

@sujathasperi2022

Create a patches folder alongside your node_modules like so:

MyAwesomeApp
- node_modules
- src
- android
- ios
- patches

Inside the patches folder, create a file called react-native-safe-area-context+4.11.1.patch and copy/paste the code from #539 (comment)

Then, run npx patch-package to apply the patch
It may be necessary to delete the android/build and android/app/.cxx folders

[hasithmeth]

@sujathasperi2022

Create a patches folder alongside your node_modules like so:

MyAwesomeApp
- node_modules
- src
- android
- ios
- patches

Inside the patches folder, create a file called react-native-safe-area-context+4.11.1.patch and copy/paste the code from #539 (comment)

Thank you so much!

[usemain]

@sujathasperi2022

在您的旁边创建一个文件夹，如下所示：patches``node_modules

MyAwesomeApp
- node_modules
- src
- android
- ios
- patches

在文件夹内，创建一个名为 #539 （comment） 的文件并复制/粘贴代码patches``react-native-safe-area-context+4.11.1.patch

Still a failure!

[Iamivan1996]

@usemain The temporary fix works for me, and I was able to build Android successfully. I also found that there are a couple of libraries that have the same error. Are you using react-native-screens or react-native-gesture-handler?

For react-native-screens, you may need to update the version to 4.0.0-beta.13
Ref : software-mansion/react-native-screens#2415

And for the react-native-gesture-handler, update the version to 2.20.2
Ref : software-mansion/react-native-gesture-handler#3109

[erie-e9]

Hi guys, facing issues with initial RN-CLI project, I also followed @craiganderson-iotv advice,

Packages:
"react": "18.3.1",
"react-native": "0.76.0",
"@react-navigation/native": "^6.1.18",
"@react-navigation/stack": "^6.4.1",
"react-native-safe-area-context": "^4.11.1",
"react-native-screens": "4.0.0-beta.13",
"react-native-gesture-handler": "2.20.2"

Steps:

• Init new project
• Install packages
• patch react-native-safe-area-context, following #539 (comment)
• Sync gradle, clean and remove android/build, android/app/build and android/app/.cxx folders
• Run rebuild...

Output: Two errors

2.

[Rohit3523]

@erie-e9 Try upgrading react-native-gesture-handler and react-native-screen package

For react-native-screens you will have to use version 4.0.0-beta.13

[DhvaniChavdaAseum]

getting same error

[laurensk]

+1

[akuul]

FIY react-native-screens 3.35.0 has 0.76 support so no need to update to -beta release

[tuan0919]

@sujathasperi2022

Create a patches folder alongside your node_modules like so:

MyAwesomeApp
- node_modules
- src
- android
- ios
- patches

Inside the patches folder, create a file called react-native-safe-area-context+4.11.1.patch and copy/paste the code from #539 (comment)

Then, run npx patch-package to apply the patch It may be necessary to delete the android/build and android/app/.cxx folders

this didn't work for me, still encounter this error after patch:

/node_modules/react-native-safe-area-context/android/src/main/jni/../../../build/generated/source/codegen/jni/react/renderer/components/safeareacontext/EventEmitters.h:12:10: fatal error: 'react/renderer/components/view/ViewEventEmitter.h' file not found

[erie-e9]

@erie-e9 Try upgrading react-native-gesture-handler and react-native-screen package

For react-native-screens you will have to use version 4.0.0-beta.13

I am already using the latest versions, in my first comment I added the used packages versions.

[Jakub-Plan-d-k]

+1

[janicduplessis]

Duplicate of #541, should be fixed now.

[sujathasperi2022]

@craiganderson-iotv Unfortunaltely the patch didnt work. But thank you for the information and effort.
Withe the latest 4.12.0 of react-native safe area context app is building at my end.
the below is my config
"react": "18.3.1", "react-native": "0.76.0", "react-native-safe-area-context": "^4.12.0", "react-native-screens": "^3.35.0", "react-native-gesture-handler": "^2.20.2"

[Rohit3523]

@sujathasperi2022 just share the error log, multiple libraries are throwing same error at the time

As I can see the culprit is react-native-screen because you are using stable version which is giving same error as this package, just do npm install [email protected]

Also don't forget to share the error

[jienigui1117ss]

the problem is "react-native-safe-area-context": "4.12.0", you must upgrade this to "4.12.0" and it worked.
this is my env ext {
buildToolsVersion = "35.0.0"
minSdkVersion = 24
compileSdkVersion = 35
targetSdkVersion = 34
ndkVersion = "26.1.10909125"
kotlinVersion = "1.9.24"
}
good luck everyone.

[jienigui1117ss]

the problem is "react-native-safe-area-context": "4.12.0", you must upgrade this to "4.12.0" and it worked.
this is my env ext {
buildToolsVersion = "35.0.0"
minSdkVersion = 24
compileSdkVersion = 35
targetSdkVersion = 34
ndkVersion = "26.1.10909125"
kotlinVersion = "1.9.24"
}

[Rohit3523]

the problem is "react-native-safe-area-context": "4.12.0", you must upgrade this to "4.12.0" and it worked. this is my env ext { buildToolsVersion = "35.0.0" minSdkVersion = 24 compileSdkVersion = 35 targetSdkVersion = 34 ndkVersion = "26.1.10909125" kotlinVersion = "1.9.24" }

????

[georgi2005atanasov]

I have the same error. Did anyone solve it?

[zjkuang]

I have the same error with
"react-native": "0.76.6"
"react-native-safe-area-context": "5.1.0"