[[email protected]] yoga/style/Style.h file not found

[birdofpreyru]

Description

Attempting to upgrade my react-native-static-server library from [email protected] to [email protected], building for iOS, new arch, getting the error with yoga:

Interestingly, I've already upgraded a couple of other libs the same way, without having this issue.

Steps to reproduce

Clone birdofpreyru/react-native-static-server@6f6c899 , try to build the Example App in the library codebase (in the /example folder) for iOS.

React Native Version

0.75.2

Affected Platforms

Runtime - iOS, Build - MacOS

Output of npx react-native info

N/A

Stacktrace or Logs

N/A

Reproducer

N/A

Screenshots and Videos

No response

[okwasniewski]

Hey,

Have you tried to remove run rm -rf Pods Podfile.lock build in the iOS folder?

I'm assuming this is an issue with Codegen generated ShadowNodes.cpp file which should be re-generated after clearing all the caches.

[birdofpreyru]

@okwasniewski I tried it now, it does not help :(

[cipolleschi]

I was cloning the project, checking out the dev-16 branch and try to run it, but I'm struggling to reach your error.

When I build from Xcode, I get:

which is weird as I created symlink for node, npm and npx in /urs/local/bin which is accessible by Xcode.

I also tried to build with

yarn ios --verbose

and that's the error I get:

Are you using CMake to build other stuffs?

---

For what concern the "missing" file... A new app from the template works fine from the template.
Do you have any special configuration? I see that the Xcode Scheme is a Custom one (not Release, nor Debug). I think that there is something funny in the configuration that needs to be updated to 0.75 to make it work.

Another thing you can try is to add these lines in this file

   if ENV['USE_FRAMEWORKS']
      header_search_path = header_search_path + [
        "\"$(PODS_TARGET_SRCROOT)/react/renderer/textlayoutmanager/platform/ios\"",
        "\"$(PODS_TARGET_SRCROOT)/react/renderer/components/textinput/platform/ios\"",
        "\"$(PODS_TARGET_SRCROOT)/react/renderer/components/view/platform/cxx\"",
      ]
    end

    ss.dependency             folly_dep_name, folly_version
+   ss.dependency			  yoga
    ss.compiler_flags       = folly_compiler_flags + ' ' + boost_compiler_flags
    ss.source_files         = "react/renderer/core/**/*.{m,mm,cpp,h}"

The ShadowNode.cpp is included by react/renderer/core and the core subspec contains it.
Weirdly, the React-Fabric pod does not depends on yoga even though files from it ends up importing Yoga files and even though it has visibility on the private headers from yoga....

[birdofpreyru]

@cipolleschi

I was cloning the project, checking out the dev-16 branch and try to run it, but I'm struggling to reach your error. <...>

Sorry, I forgot to mention you need to git submodule update --init --recursive in the codebase root, to clone & checkout a couple of git submodules it depends upon.

Do you have any special configuration? I see that the Xcode Scheme is a Custom one (not Release, nor Debug)

In theory, that Custom configuration is the same as Debug or Release (I don't remember now, which one exactly), it just tests the build does not break with non-standard configuration name (it used to happen at some point, because CMake was looking at wrong folders).

The library's Podspec (https://github.com/birdofpreyru/react-native-static-server/blob/master/dr-pogodin-react-native-static-server.podspec) has a bunch of custom stuff to orchestrate CMake part of the build... perhaps I need to double-check how it differs from the clean version from the template.

[cipolleschi]

Thanks for the context. I tried to spend some more time on the issue: using yarn ios --verbose I can build up until the yoga/style/Style.h file not found error.

However, not being able to use Xcode makes it hard because I don't have the import chain and so I can't find which file is importing Yoga.

The yoga/style/Style.h is a private header and it is definitely there and properly configured... We might have missed to add one search_path somewhere.

@birdofpreyru could you please expand the error in your xcode so I can see the import chain?

[birdofpreyru]

here you are @cipolleschi

[cipolleschi]

Does the react-native-static-server library also have Components other than modules?
Because I can see that it generates a RNReactNativeStaticServerSpec folder with some component codegen but it is mostly empty...

Also, who is running these commands:

These are not part of our usual cycle. Could it be Bob?

[cipolleschi]

If I change the codegenConfig in the package.json like this:

 "codegenConfig": {
    "name": "RNReactNativeStaticServerSpec",
+    "type": "modules",
-     "type": "all",
    "jsSrcsDir": "src",
    "windows": {
      "namespace": "winrt::ReactNativeStaticServer",
      "outputDirectory": "windows/ReactNativeStaticServer/codegen"
    },
    "outputDir": {
      "ios": "ios/generated",
      "android": "android/generated"
    },
    "android": {
      "javaPackageName": "com.drpogodin.reactnativestaticserver"
    },
    "includesGeneratedCode": true
  },

It works. I think that Bob is doing some weird stuff there.

[birdofpreyru]

@cipolleschi Awesome! I'll double-check later it does not break the build for other target platforms.

For record, "type": "all" comes from the library template created by create-react-native-library. Not sure now, should be this issue moved to its repo, or should it stay here, how do we handle it to fix the root cause?

By the way, you asked for repro in #46201 — here you got it, if you just press Send a message to the React Native layer button, it will attempt to send a message to RN and show an alert, and that does not show up, as the alert fails with the error I reported in #46201 (though, when build for Android, obviously I had no chance to try it on iOS yet :)

[cipolleschi]

Not sure now, should be this issue moved to its repo, or should it stay here, how do we handle it to fix the root cause?

the "all" alternative is supported by codegen. But I think that they are doing some shenanigans on top of what we do with codegen and that somehow breaks it.

It's probably a good idea to move the issue to their repo or to create a new one there.
I'll reach out to them tomorrow to see if they know something about it.

By the way, #46201 (comment) for repro in #46201 — here you got it, if you just press Send a message to the React Native layer button, it will attempt to send a message to RN and show an alert, and that does not show up, as the alert fails with the error I reported in #46201 (though, when build for Android, obviously I had no chance to try it on iOS yet :)

thanks, I'll try to look into it soon (although I'm more an iOS guy. 😅 )

[memosize]

it is also shows at 0.76.1

[cipolleschi]

it is also shows at 0.76.1

@memosize what is shown in 0.76.1? The error?

[memosize]

it is also shows at 0.76.1

@memosize what is shown in 0.76.1? The error?

if I'm not add header search path like this

[clarkquinatadcan]

it is also shows at 0.76.1

I had the same issue on RN 0.76.1. Adding this to the Podfile fixed the issue for me.

  # Path to the Yoga headers in Private
  private_yoga_headers = "#{installer.sandbox.root}/Headers/Private/Yoga"
  # Path to the Yoga headers in Public
  public_yoga_headers = "#{installer.sandbox.root}/Headers/Public/Yoga"

  # Copy the Yoga headers from Private to Public
  FileUtils.mkdir_p(public_yoga_headers) unless Dir.exist?(public_yoga_headers)
  system("rsync -a #{private_yoga_headers}/ #{public_yoga_headers}")

[cipolleschi]

A fix for this will be released in RN 0.76.2

[rrr-kaio-labre]

@clarkquinatadcan in which part of the Podfile did you add that piece of code?

[hannojg]

hey, do you know which commit addresses this issue exactly? (as RN 0.76.2 isn't out yet)

[abhayarawal]

Since it needs the installer var, it should be inside the post_install do |installer| block. It worked for me.

post_install do |installer|
    # Path to the Yoga headers in Private
    private_yoga_headers = "#{installer.sandbox.root}/Headers/Private/Yoga"
    # Path to the Yoga headers in Public
    public_yoga_headers = "#{installer.sandbox.root}/Headers/Public/Yoga"

    # Copy the Yoga headers from Private to Public
    FileUtils.mkdir_p(public_yoga_headers) unless Dir.exist?(public_yoga_headers)
    system("rsync -a #{private_yoga_headers}/ #{public_yoga_headers}")


    # https://github.com/facebook/react-native/blob/main/packages/react-native/scripts/react_native_pods.rb#L197-L202
    react_native_post_install(
      installer,
      config[:reactNativePath],
      :mac_catalyst_enabled => false,
       # :ccache_enabled => true
    )
end

[atlj]

Hey @cipolleschi does this mean some of the libraries won't compile with certain versions of React Native? Anything we can do on bob?

the "all" alternative is supported by codegen. But I think that they are doing some shenanigans on top of what we do with codegen and that somehow breaks it.

If we are abusing all here, we can revert it back to module, and yes we do some shenanigans 😄 but it's only for android

[cipolleschi]

@atlj Honestly, I'm not sure. The problem was happening in the original issue because the codegen was generating some stuff for components when there were no actual components in the library. In theory that should not be a problem, but practically it was.

I think you can easily reproduce the issue by following the steps above. In general, I'd say that if a user choose to create a TM, it's better to set the type to modules. If they chose to build a component, let's set the type to components.

It's alway better to have less code to build! 😉

does this mean some of the libraries won't compile with certain versions of React Native?

We guaranteed Codegen working only for the latest version of React Native as codegen was part of the New Architecture. Now that the new architecture is stable we are going to guarantee that codegen works for versions > 0.76 and in the official support windows.
so yeah, technically, yes, libraries depending on older versions of Codegen might not build.

[atlj]

Hey folks, I was able to reproduce this without bob on React Native 0.76.3. Looks like there is a problem when the codegen type is set to all and the lib developer tries to import their Props header.

[atlj]

A workaround for lib devs:

You can add the yoga private headers to the header search paths:

s.pod_target_xcconfig    = {
  "HEADER_SEARCH_PATHS" => "\"$(PODS_ROOT)/boost\"  \"${PODS_ROOT}/Headers/Private/Yoga\"", # <-- Yoga is added here
  "OTHER_CPLUSPLUSFLAGS" => "-DFOLLY_NO_CONFIG -DFOLLY_MOBILE=1 -DFOLLY_USE_LIBCPP=1",
  "CLANG_CXX_LANGUAGE_STANDARD" => "c++17"
}

Here's a complete example: https://github.com/ArturKalach/react-native-a11y/blob/0b32d691c50b608c0d7fe221c73458f197fa2401/react-native-a11y.podspec#L25

I will also land this fix in create-react-native-library for new projects.

Here's another comment recommending the same fix: react-native-webview/react-native-webview#3218 (comment)