Summary: This Diff is being posted for discussion purposes. It will not be ready to land until React DevTools v4 has been published to NPM. Update React Native to be compatible with the [new version 4 React DevTools extension](https://github.com/bvaughn/react-devtools-experimental). **Note that this is a breaking change**, as the version 3 and version 4 backends are **not compatible**. Once this update ships (in React Native) users will be required to update their version of the [`react-devtools` NPM package](https://www.npmjs.com/package/react-devtools). The same will be true for IDEs like Nuclide as well as other developer tools like Flipper and [React Native Debugger](https://github.com/jhen0409/react-native-debugger). Related changes also included in this diff are: * Pass an explicit whitelist of style props for the React Native style editor (to improve developer experience when adding new styles). * Update `YellowBox` console patching to coordinate with DevTools own console patching. * Also improved formatting slightly by not calling `stringifySafe` for strings (since this adds visible quotation marks). Regarding the console patching- component stacks will be appended by default when there's no DevTools frontend open. The frontend will provide an option to turn this behavior off though: {F168852162} React DevTools will detect if the new version is used with an older version of React Native, and offer inline upgrade instructions: {F169306863} **Note that the change to the `RCTEnableTurboModule` will not be included in this Diff**. I've just turned those off temporarily so I can use v8+Chrome for debugging. Reviewed By: rickhanlonii Differential Revision: D15973709 fbshipit-source-id: bb9d83fc829af4693e7a10a622acc95a411a48e4
Flipper

Flipper (formerly Sonar) is a platform for debugging mobile apps on iOS and Android. Visualize, inspect, and control your apps from a simple desktop interface. Use Flipper as is or extend it using the plugin API.
Table of Contents
- Mobile development
- Extending Flipper
- Contributing to Flipper
- In this repo
- Getting started
- Building from Source
Mobile development
Flipper aims to be your number one companion for mobile app development on iOS and Android. Therefore, we provide a bunch of useful tools including a log viewer, interactive layout inspector, and network inspector.
Extending Flipper
Flipper is built as a platform. In addition to using the tools already included, you can create your own plugins to visualize and debug data from your mobile apps. Flipper takes care of sending data back and forth, calling functions, and listening for events on the mobile app.
Contributing to Flipper
Both Flipper's desktop app and native mobile SDKs are open-source and MIT licensed. This enables you to see and understand how we are building plugins, and of course join the community and help improve Flipper. We are excited to see what you will build on this platform.
In this repo
This repository includes all parts of Flipper. This includes:
- Flipper's desktop app built using Electron (
/src) - native Flipper SDKs for iOS (
/iOS) - native Flipper SDKs for Android (
/android) - Plugins:
- Logs (
/src/device-plugins/logs) - Layout inspector (
/src/plugins/layout) - Network inspector (
/src/plugins/network) - Shared Preferences/NSUserDefaults inspector (
/src/plugins/shared_preferences)
- Logs (
- website and documentation (
/website//docs)
Getting started
Please refer to our Getting Started guide to set up Flipper.
Requirements
- macOS (Flipper works on Linux and Windows, too, but we only support macOS officially at the moment.)
- node >= 8
- yarn >= 1.5
- iOS developer tools (for developing iOS plugins)
- Android SDK and adb
Building from Source
Desktop
Running from source
git clone https://github.com/facebook/flipper.git
cd flipper
yarn
yarn start
NOTE: If you're on Windows, you need to use Yarn 1.5.1 until this issue is resolved.
Building standalone application
yarn build --mac --version $buildNumber
iOS SDK + Sample App
cd iOS/Sample
rm -f Podfile.lock
pod install --repo-update
open Sample.xcworkspace
<Run app from xcode>
You can omit --repo-update to speed up the installation, but watch out as you may be building against outdated dependencies.
Android SDK + Sample app
Start up an android emulator and run the following in the project root:
./gradlew :sample:installDebug
Documentation
Find the full documentation for this project at fbflipper.com.
Our documentation is built with Docusaurus. You can build it locally by running this:
cd website
yarn
yarn start
Contributing
See the CONTRIBUTING file for how to help out.
License
Flipper is MIT licensed, as found in the LICENSE file.
