Integration With Existing iOS Project failed: 'CSSLayout/CSSLayout.h' file not found

Description

After upgrade to react-native@0.39, Integration With Existing Empty iOS Project failed, and old workaround "postinstall": "find ./node_modules/react-native \\( -name *.h -o -name *.m \\) -print0 | xargs -0 sed -i '' -e 's:<CSSLayout/\\(.*\\)>:\"\\1\":g'" doesn’t work now

react-native@0.38 works just fine

Reproduction

1. create an empty iOS project with swift
2. follow the official guide of integration with existing app
3. try run iOS app and then failed

Additional Information

• React Native version: 0.39
• Platform: iOS
• Operating System: MacOS Sierra 10.12.1
• CocoaPods: 1.1.1

[notjosh]

I wrote a post_install function to handle this issue, along with #11502 (only tested on React Native 0.39.2)

# only for React Native ^0.39.[0-2] afaik
def patch_csslayout(installer)
  version = `node -p -e "require('#{REACT_NATIVE_PATH}/package.json').version"`

  unless version =~ /^0\.39\.[0-2]$/
    puts ">> Unsure if I should patch for CSSLayout on React Native #{version}. Skipping."
    return
  end

  puts ">> Patching for CSSLayout on React Native #{version}"

  # patch header files
  # https://github.com/facebook/react-native/issues/11272
  `find #{REACT_NATIVE_PATH} \\( -name *.h -o -name *.m \\) -print0 | xargs -0 sed -i '' -e 's:<CSSLayout/\\(.*\\)>:"\\1":g'`

  # exclude duplicate symbols
  # https://github.com/facebook/react-native/issues/11502
  installer.pods_project.targets.each do |target|
    next unless target.name == 'React'

    source_files = target.source_build_phase.files
    uniqs = source_files.uniq { |f| f.file_ref.path }
    (source_files - uniqs).each { |dup| source_files.delete(dup) }
  end
end

Use as follows:

post_install do |installer|
  patch_csslayout(installer)
end

Hope that helps unblock others on 0.39.2!

---

Also: I first tried the “add a header search path” version. It builds the library fine, but broken when building the Swift module/bridge. It might be fine for objc projects though, so here’s the code if it’s useful to anyone:

post_install do |installer|
  installer.pods_project.targets.each do |target|
    next unless target.name == 'React'

    target.build_configurations.each do |config|
      xcconfig_path = config.base_configuration_reference.real_path

      # read from xcconfig to build_settings dictionary
      build_settings = Hash[*File.read(xcconfig_path).lines.map { |x|
        x.split(/\s*=\s*/, 2)
      }.flatten]

      # modify HEADER_SEARCH_PATHS
      path = "${PODS_ROOT}/../#{REACT_NATIVE_PATH}/ReactCommon/**"

      build_settings['HEADER_SEARCH_PATHS'] = '' unless build_settings['HEADER_SEARCH_PATHS']
      build_settings['HEADER_SEARCH_PATHS'].rstrip! << " #{path}" unless build_settings['HEADER_SEARCH_PATHS'].include?(path)

      # write build_settings dictionary to xcconfig
      File.open(xcconfig_path, 'w+') do |file|
        build_settings.each do |key, value|
          file.puts "#{key} = #{value}"
        end
      end
    end
  end
end

Then you can cat /Users/joshua/dev/work/Taxfix/taxfix-ios/Pods/Target\ Support\ Files/React/React.xcconfig to verify it’s there afterward.

[joncursi]

I bumped into this same issue with the react-native-youtube library when trying to upgrade to 0.39.x. See https://github.com/inProgress-team/react-native-youtube/issues/88