mobx-remotedev

Remote debugging for MobX with Redux DevTools extension (and remotedev coming soon)

Installation

1. Get the extension

1.1 For Chrome

• from Chrome Web Store
• or build it with npm i & npm run build:extension and load the extension's folder ./build/extension
• or run it in dev mode with npm i & npm start and load the extension's folder ./dev.

1.2 For Firefox

• from AMO
• or build it with npm i & npm run build:firefox and load the extension's folder ./build/firefox.

1.3 For Electron

• just specify REDUX_DEVTOOLS in electron-devtools-installer.

1.4 For other browsers, for React Native, hybrid, desktop and server side apps

• Coming...

2. Install the library

npm install --save mobx-remotedev

Usage

import remotedev from 'mobx-remotedev';
// or import remotedev from 'mobx-remotedev/lib/dev'
// in case you want to use it in production or don't have process.env.NODE_ENV === 'development'

const appStore = observable({
  // ...
});

// Or
class appStore {
	// ...
}

export default remotedev(appStore);

See counter and todomvc examples.

API

remotedev(store, [config])

• arguments
  • store observable or class to be monitored. In case you want to change its values (to time travel or cancel actions), you should export its result as in the example above (so we can extend the class).
  • config object (optional as the parameters bellow)
    • name string - the instance name to be showed on the monitor page. Default value is document.title.
    • shouldStringify boolean - set it to true when having circular references or special types like ImmutableJS. By default is false.

Also see the extension API and my presentation at React Europe.

Exclude / include DevTools in production builds

By default use

import remotedev from 'mobx-remotedev';

It will work only when process.env.NODE_ENV === 'development', otherwise the code will be stripped.

In case you want to use it in production or cannot set process.env.NODE_ENV, use

import remotedev from 'mobx-remotedev/lib/dev';

So, the code will not be stripped from production bundle and you can use the extension even in production. It wouldn't affect the performance for end-users who don't have the extension installed.

LICENSE

MIT

Created By

If you like this, follow @mdiordiev on twitter.