Skip to content

khorark/mobx-flipper

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

26 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Mobx Flipper

screenshot of the plugin

flipper-plugin-mobx-debugger allows you read React Native mobx logs inside Flipper now:

  • Action
  • State comparison

Get Started

  1. Install mobx-flipper middleware and react-native-flipper in your React Native app:
yarn add mobx-flipper react-native-flipper
# for iOS
cd ios && pod install
  1. Add the middleware:
  • MobX
import {spy} from 'mobx';
import {createMobxDebugger} from 'mobx-flipper';

const store = new Store(); // your store

if (__DEV__) {
  spy(createMobxDebugger(store));
}
  • MobX-state-tree
import {addMiddleware} from 'mobx-state-tree';
import {createMstDebugger} from 'mobx-flipper';

const store = new Store(); // your store

if (__DEV__) {
  addMiddleware(store, createMstDebugger(store));
}
  1. Install flipper-plugin-mobx-debugger in Flipper desktop client:
Manage Plugins > Install Plugins > search "mobx-debugger" > Install
  1. Start your app, then you should be able to see Mobx Debugger on your Flipper app

Acknowledgement

This plugin is inspired by flipper-plugin-redux-debugger.