Skip to content
This repository has been archived by the owner on Nov 22, 2024. It is now read-only.

Docs: "Opting out from Flipper" and "Disable Flipper on CI builds" in React Native should be updated since the Podfile changed in react-native 0.69.2 #3995

Open
Adnan-Bacic opened this issue Aug 12, 2022 · 10 comments

Comments

@Adnan-Bacic
Copy link

Adnan-Bacic commented Aug 12, 2022

for these 2:

https://fbflipper.com/docs/getting-started/troubleshooting/react-native/#opting-out-from-flipper-ios

https://fbflipper.com/docs/getting-started/troubleshooting/react-native/#disable-flipper-on-ci-builds-ios

they show:

  1. how to opt out of flipper
  2. how to disable flipper in CI builds

however, since react-native 0.69.2, the Podfile has been changed so those examples no longer work.

the changes can be seen upgrade helper from 0.69.1 to 0.69.2: https://react-native-community.github.io/upgrade-helper/?from=0.69.1&to=0.69.2

the current examples could stay, as they are still relevant to react-native projects running a version less than 0.69.2. i suggest adding new examples for the new Podfile syntax.

i assume the change for opting out of flipper would be(though im not sure since i could find anything about the FlipperConfiguration variable):

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

and to disable in CI(this may be incorrect and is just a guess.

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

just tested the above code and i get errors related to invalid Podfile syntax when running "pod install". so this is probably not a good way to do it

you could probably also change the enabled/disabled variable. though im not familiar with ruby so i wouldt know exactly how to change that value.

i think i could do these changes. what do the maintainers think about this change?

@Nantris
Copy link

Nantris commented Aug 23, 2022

Related issue: jakobo/expo-community-flipper#18

@robinclaes
Copy link

robinclaes commented Dec 1, 2022

When disabling via FlipperConfiguration.disabled, the build now fails as seen below
image

This issue is related.

This is blocking for us because we can't build via AppCenter with Flipper (surpassing 60 minutes 🙄 )

@Adnan-Bacic
Copy link
Author

When disabling via FlipperConfiguration.disabled, the build now fails as seen below image

This issue is related.

This is blocking for us because we can't build via AppCenter with Flipper (surpassing 60 minutes 🙄 )

hmm thats wierd. i just decided to disable flipper the same way as you since i wasent using it, and appcenter works fine for me still.

@robinclaes
Copy link

The iOS compile error originates from the package with javascript bindings to add plugins:
https://www.npmjs.com/package/react-native-flipper

So I guess only those who use Flipper plugins (like the redux plugin) are seeing this error.

@retyui
Copy link

retyui commented Dec 20, 2022

When disabling via FlipperConfiguration.disabled, the build now fails as seen below image
This issue is related.
This is blocking for us because we can't build via AppCenter with Flipper (surpassing 60 minutes roll_eyes )

hmm thats wierd. i just decided to disable flipper the same way as you since i wasent using it, and appcenter works fine for me still.

Solution is easy:

// react-native.config.js
module.exports = {
  dependencies: {
    ...(process.env.CI ? { 'react-native-flipper': { platforms: { ios: null } } } : {}),
  },
  project: {
    ios: {},
    android: {},
  },
};

see more in a Troubleshooting part : https://dev.to/retyui/disable-flipper-on-ci-builds-for-react-native-complete-guide-bnd

@retyui
Copy link

retyui commented Dec 20, 2022

to turn off Flipper on CI you can do next:

# ./ios/Podfile
use_react_native!(
  :flipper_configuration => ENV['CI'] ? FlipperConfiguration.disabled : FlipperConfiguration.enabled,

facebook-github-bot pushed a commit to facebook/react-native that referenced this issue Jan 12, 2023
…ld fail (#35686)

Summary:
- Flipper issue: facebook/flipper#3995 (comment)

iOS build fail with an error:

```sh
node_modules/react-native-flipper/ios/FlipperReactNativeJavaScriptPlugin.h:9:9: 'FlipperKit/FlipperConnection.h' file not found

#import <FlipperKit/FlipperConnection.h>
```

## Changelog

[IOS] [FIXED] - Exclude `react-native-flipper` when `NO_FLIPPER=1` to prevent iOS build fail

Pull Request resolved: #35686

Test Plan:
```sh
npx react-native init RN0710RC5 --version 0.71.0-rc.5
cd RN0710RC5
yarn add react-native-flipper
NO_FLIPPER=1 pod install --project-directory=ios
yarn ios # will fail
```

Reviewed By: rshest

Differential Revision: D42368444

Pulled By: cipolleschi

fbshipit-source-id: a8614ccadb98970ebae15d8743136fa60ead318c
kelset pushed a commit to facebook/react-native that referenced this issue Jan 19, 2023
…ld fail (#35686)

Summary:
- Flipper issue: facebook/flipper#3995 (comment)

iOS build fail with an error:

```sh
node_modules/react-native-flipper/ios/FlipperReactNativeJavaScriptPlugin.h:9:9: 'FlipperKit/FlipperConnection.h' file not found

#import <FlipperKit/FlipperConnection.h>
```

## Changelog

[IOS] [FIXED] - Exclude `react-native-flipper` when `NO_FLIPPER=1` to prevent iOS build fail

Pull Request resolved: #35686

Test Plan:
```sh
npx react-native init RN0710RC5 --version 0.71.0-rc.5
cd RN0710RC5
yarn add react-native-flipper
NO_FLIPPER=1 pod install --project-directory=ios
yarn ios # will fail
```

Reviewed By: rshest

Differential Revision: D42368444

Pulled By: cipolleschi

fbshipit-source-id: a8614ccadb98970ebae15d8743136fa60ead318c
@andac-ozcan
Copy link

andac-ozcan commented Feb 6, 2023

There's a very nice article which helped me a lot. Original article: https://dev.to/retyui/disable-flipper-on-ci-builds-for-react-native-complete-guide-bnd

@retyui
Copy link

retyui commented Feb 13, 2023

@andac-ozcan You're welcome for copying my article without providing the source link.

@andac-ozcan
Copy link

@andac-ozcan You're welcome for copying my article without providing the source link.

https://dev.to/retyui/disable-flipper-on-ci-builds-for-react-native-complete-guide-bnd

Sorry about that. I just updated my post 🙏

OlimpiaZurek pushed a commit to OlimpiaZurek/react-native that referenced this issue May 22, 2023
…ld fail (facebook#35686)

Summary:
- Flipper issue: facebook/flipper#3995 (comment)

iOS build fail with an error:

```sh
node_modules/react-native-flipper/ios/FlipperReactNativeJavaScriptPlugin.h:9:9: 'FlipperKit/FlipperConnection.h' file not found

#import <FlipperKit/FlipperConnection.h>
```

## Changelog

[IOS] [FIXED] - Exclude `react-native-flipper` when `NO_FLIPPER=1` to prevent iOS build fail

Pull Request resolved: facebook#35686

Test Plan:
```sh
npx react-native init RN0710RC5 --version 0.71.0-rc.5
cd RN0710RC5
yarn add react-native-flipper
NO_FLIPPER=1 pod install --project-directory=ios
yarn ios # will fail
```

Reviewed By: rshest

Differential Revision: D42368444

Pulled By: cipolleschi

fbshipit-source-id: a8614ccadb98970ebae15d8743136fa60ead318c
@ikotsov
Copy link

ikotsov commented Sep 1, 2023

@andac-ozcan Thank you for sharing the article! It is very helpful indeed.

@retyui I was wondering, in react-native 0.71 version, there is no need to define the pod installation: pod install --project-directory=ios depending on the CI setup, right?

For example, I use App Center. I just have to define the export NO_FLIPPER=1 and then this variable will be read by the react-native itself. Would it work like this?

I suppose that in case someone defines exactly all the build steps (npm or pod dependencies installation), then they also have to include the pod install command.

Mentioning it, because it is not fully clear in the article.

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

6 participants