UNPKG

3.27 kBMarkdownView Raw
1# Redux DevTools Instrumentation
2
3Redux enhancer used along with [Redux DevTools](https://github.com/reduxjs/redux-devtools) or [Remote Redux DevTools](https://github.com/zalmoxisus/remote-redux-devtools).
4
5### Installation
6
7```
8npm install --save-dev redux-devtools-instrument
9```
10
11### Usage
12
13Add the store enhancer:
14
15##### `store/configureStore.js`
16
17```js
18import { createStore, applyMiddleware, compose } from 'redux';
19import thunk from 'redux-thunk';
20import devTools from 'remote-redux-devtools';
21import reducer from '../reducers';
22
23// Usually you import the reducer from the monitor
24// or apply with createDevTools as explained in Redux DevTools
25const monitorReducer = (state = {}, action) => state;
26
27export default function configureStore(initialState) {
28 const enhancer = compose(
29 applyMiddleware(...middlewares),
30 // other enhancers and applyMiddleware should be added before the instrumentation
31 instrument(monitorReducer, { maxAge: 50 })
32 );
33
34 // Note: passing enhancer as last argument requires redux@>=3.1.0
35 return createStore(reducer, initialState, enhancer);
36}
37```
38
39### API
40
41`instrument(monitorReducer, [options])`
42
43- arguments
44 - **monitorReducer** _function_ called whenever an action is dispatched ([see the example of a monitor reducer](https://github.com/gaearon/redux-devtools-log-monitor/blob/master/src/reducers.js#L13)).
45 - **options** _object_
46 - **maxAge** _number_ or _function_(currentLiftedAction, previousLiftedState) - maximum allowed actions to be stored on the history tree, the oldest actions are removed once `maxAge` is reached. Can be generated dynamically with a function getting current action as argument.
47 - **shouldCatchErrors** _boolean_ - if specified as `true`, whenever there's an exception in reducers, the monitors will show the error message, and next actions will not be dispatched.
48 - **shouldRecordChanges** _boolean_ - if specified as `false`, it will not record the changes till `pauseRecording(false)` is dispatched. Default is `true`.
49 - **pauseActionType** _string_ - if specified, whenever `pauseRecording(false)` lifted action is dispatched and there are actions in the history log, will add this action type. If not specified, will commit when paused.
50 - **shouldStartLocked** _boolean_ - if specified as `true`, it will not allow any non-monitor actions to be dispatched till `lockChanges(false)` is dispatched. Default is `false`.
51 - **shouldHotReload** _boolean_ - if set to `false`, will not recompute the states on hot reloading (or on replacing the reducers). Default to `true`.
52 - **trace** _boolean_ or _function_ - if set to `true`, will include stack trace for every dispatched action. You can use a function (with action object as argument) which should return `new Error().stack` string, getting the stack outside of reducers. Default to `false`.
53 - **traceLimit** _number_ - maximum stack trace frames to be stored (in case `trace` option was provided as `true`). By default it's `10`. If `trace` option is a function, `traceLimit` will have no effect, that should be handled there like so: `trace: () => new Error().stack.split('\n').slice(0, limit+1).join('\n')` (`+1` is needed for Chrome where's an extra 1st frame for `Error\n`).
54
55### License
56
57MIT