This commit is contained in:
Nathan Bierema 2020-10-26 02:18:44 -04:00
parent 1dc970c333
commit 3187a40483
10 changed files with 137 additions and 106 deletions

View File

@ -4,34 +4,46 @@
## Usage ## Usage
Install: Install:
```
npm install --save redux-devtools-extension
```
and use like that:
```js
import { createStore, applyMiddleware } from 'redux';
import { composeWithDevTools } from 'redux-devtools-extension';
const store = createStore(reducer, composeWithDevTools( ```
applyMiddleware(...middleware), npm install --save redux-devtools-extension
// other store enhancers if any ```
));
```
or if needed to apply [extensions options](https://github.com/zalmoxisus/redux-devtools-extension/blob/master/docs/API/Arguments.md#windowdevtoolsextensionconfig):
```js
import { createStore, applyMiddleware } from 'redux';
import { composeWithDevTools } from 'redux-devtools-extension';
const composeEnhancers = composeWithDevTools({ and use like that:
// Specify here name, actionsBlacklist, actionsCreators and other options
}); ```js
const store = createStore(reducer, composeEnhancers( import { createStore, applyMiddleware } from 'redux';
applyMiddleware(...middleware), import { composeWithDevTools } from 'redux-devtools-extension';
const store = createStore(
reducer,
composeWithDevTools(
applyMiddleware(...middleware)
// other store enhancers if any // other store enhancers if any
)); )
``` );
Therere just [few lines of code](https://github.com/zalmoxisus/redux-devtools-extension/blob/master/npm-package/index.js). If you dont want to allow the extension in production, just use redux-devtools-extension/developmentOnly instead of redux-devtools-extension. ```
or if needed to apply [extensions options](https://github.com/zalmoxisus/redux-devtools-extension/blob/master/docs/API/Arguments.md#windowdevtoolsextensionconfig):
```js
import { createStore, applyMiddleware } from 'redux';
import { composeWithDevTools } from 'redux-devtools-extension';
const composeEnhancers = composeWithDevTools({
// Specify here name, actionsBlacklist, actionsCreators and other options
});
const store = createStore(
reducer,
composeEnhancers(
applyMiddleware(...middleware)
// other store enhancers if any
)
);
```
Therere just [few lines of code](https://github.com/zalmoxisus/redux-devtools-extension/blob/master/npm-package/index.js). If you dont want to allow the extension in production, just use redux-devtools-extension/developmentOnly instead of redux-devtools-extension.
## License ## License

View File

@ -1 +1 @@
export * from "redux-devtools-extension"; export * from 'redux-devtools-extension';

View File

@ -1,22 +1,26 @@
"use strict"; 'use strict';
var compose = require('redux').compose; var compose = require('redux').compose;
exports.__esModule = true; exports.__esModule = true;
exports.composeWithDevTools = ( exports.composeWithDevTools =
process.env.NODE_ENV !== 'production' && typeof window !== 'undefined' && process.env.NODE_ENV !== 'production' &&
window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ ? typeof window !== 'undefined' &&
window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ : window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__
function() { ? window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__
if (arguments.length === 0) return undefined; : function () {
if (typeof arguments[0] === 'object') return compose; if (arguments.length === 0) return undefined;
return compose.apply(null, arguments); if (typeof arguments[0] === 'object') return compose;
} return compose.apply(null, arguments);
); };
exports.devToolsEnhancer = ( exports.devToolsEnhancer =
process.env.NODE_ENV !== 'production' && typeof window !== 'undefined' && process.env.NODE_ENV !== 'production' &&
window.__REDUX_DEVTOOLS_EXTENSION__ ? typeof window !== 'undefined' &&
window.__REDUX_DEVTOOLS_EXTENSION__ : window.__REDUX_DEVTOOLS_EXTENSION__
function() { return function(noop) { return noop; } } ? window.__REDUX_DEVTOOLS_EXTENSION__
); : function () {
return function (noop) {
return noop;
};
};

View File

@ -1,4 +1,4 @@
import {Action, ActionCreator, StoreEnhancer, compose} from "redux"; import { Action, ActionCreator, StoreEnhancer, compose } from 'redux';
export interface EnhancerOptions { export interface EnhancerOptions {
/** /**
@ -9,7 +9,7 @@ export interface EnhancerOptions {
/** /**
* action creators functions to be available in the Dispatcher. * action creators functions to be available in the Dispatcher.
*/ */
actionCreators?: ActionCreator<any>[] | {[key: string]: ActionCreator<any>}; actionCreators?: ActionCreator<any>[] | { [key: string]: ActionCreator<any> };
/** /**
* if more than one action is dispatched in the indicated interval, all new actions will be collected and sent at once. * if more than one action is dispatched in the indicated interval, all new actions will be collected and sent at once.
* It is the joint between performance and speed. When set to `0`, all actions will be sent instantly. * It is the joint between performance and speed. When set to `0`, all actions will be sent instantly.
@ -33,16 +33,18 @@ export interface EnhancerOptions {
* For `function` key you can also specify a custom function which handles serialization. * For `function` key you can also specify a custom function which handles serialization.
* See [`jsan`](https://github.com/kolodny/jsan) for more details. * See [`jsan`](https://github.com/kolodny/jsan) for more details.
*/ */
serialize?: boolean | { serialize?:
date?: boolean; | boolean
regex?: boolean; | {
undefined?: boolean; date?: boolean;
error?: boolean; regex?: boolean;
symbol?: boolean; undefined?: boolean;
map?: boolean; error?: boolean;
set?: boolean; symbol?: boolean;
function?: boolean | Function; map?: boolean;
}; set?: boolean;
function?: boolean | Function;
};
/** /**
* function which takes `action` object and id number as arguments, and should return `action` object back. * function which takes `action` object and id number as arguments, and should return `action` object back.
*/ */
@ -128,11 +130,11 @@ export interface EnhancerOptions {
/** /**
* export history of actions in a file * export history of actions in a file
*/ */
export?: boolean | "custom"; export?: boolean | 'custom';
/** /**
* import history of actions from a file * import history of actions from a file
*/ */
import?: boolean | "custom"; import?: boolean | 'custom';
/** /**
* jump back and forth (time travelling) * jump back and forth (time travelling)
*/ */
@ -165,6 +167,8 @@ export interface EnhancerOptions {
traceLimit?: number; traceLimit?: number;
} }
export function composeWithDevTools<StoreExt, StateExt>(...funcs: Array<StoreEnhancer<StoreExt>>): StoreEnhancer<StoreExt>; export function composeWithDevTools<StoreExt, StateExt>(
...funcs: Array<StoreEnhancer<StoreExt>>
): StoreEnhancer<StoreExt>;
export function composeWithDevTools(options: EnhancerOptions): typeof compose; export function composeWithDevTools(options: EnhancerOptions): typeof compose;
export function devToolsEnhancer(options: EnhancerOptions): StoreEnhancer<any>; export function devToolsEnhancer(options: EnhancerOptions): StoreEnhancer<any>;

View File

@ -1,20 +1,22 @@
"use strict"; 'use strict';
var compose = require('redux').compose; var compose = require('redux').compose;
exports.__esModule = true; exports.__esModule = true;
exports.composeWithDevTools = ( exports.composeWithDevTools =
typeof window !== 'undefined' && window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ ? typeof window !== 'undefined' && window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__
window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ : ? window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__
function() { : function () {
if (arguments.length === 0) return undefined; if (arguments.length === 0) return undefined;
if (typeof arguments[0] === 'object') return compose; if (typeof arguments[0] === 'object') return compose;
return compose.apply(null, arguments); return compose.apply(null, arguments);
} };
);
exports.devToolsEnhancer = ( exports.devToolsEnhancer =
typeof window !== 'undefined' && window.__REDUX_DEVTOOLS_EXTENSION__ ? typeof window !== 'undefined' && window.__REDUX_DEVTOOLS_EXTENSION__
window.__REDUX_DEVTOOLS_EXTENSION__ : ? window.__REDUX_DEVTOOLS_EXTENSION__
function() { return function(noop) { return noop; } } : function () {
); return function (noop) {
return noop;
};
};

View File

@ -1 +1 @@
export * from "redux-devtools-extension"; export * from 'redux-devtools-extension';

View File

@ -1,4 +1,4 @@
"use strict"; 'use strict';
var assign = require('./utils/assign'); var assign = require('./utils/assign');
var compose = require('redux').compose; var compose = require('redux').compose;
@ -10,15 +10,15 @@ function enhancer() {
if (config.autoPause === undefined) config.autoPause = true; if (config.autoPause === undefined) config.autoPause = true;
if (config.latency === undefined) config.latency = 500; if (config.latency === undefined) config.latency = 500;
return function(createStore) { return function (createStore) {
return function(reducer, preloadedState, enhancer) { return function (reducer, preloadedState, enhancer) {
var store = createStore(reducer, preloadedState, enhancer); var store = createStore(reducer, preloadedState, enhancer);
var origDispatch = store.dispatch; var origDispatch = store.dispatch;
var devTools = window.__REDUX_DEVTOOLS_EXTENSION__.connect(config); var devTools = window.__REDUX_DEVTOOLS_EXTENSION__.connect(config);
devTools.init(store.getState()); devTools.init(store.getState());
var dispatch = function(action) { var dispatch = function (action) {
var r = origDispatch(action); var r = origDispatch(action);
devTools.send(action, store.getState()); devTools.send(action, store.getState());
return r; return r;
@ -26,21 +26,22 @@ function enhancer() {
if (Object.assign) return Object.assign(store, { dispatch: dispatch }); if (Object.assign) return Object.assign(store, { dispatch: dispatch });
return assign(store, 'dispatch', dispatch); return assign(store, 'dispatch', dispatch);
} };
} };
} }
function composeWithEnhancer(config) { function composeWithEnhancer(config) {
return function () { return function () {
return compose(compose.apply(null, arguments), enhancer(config)); return compose(compose.apply(null, arguments), enhancer(config));
} };
} }
exports.__esModule = true; exports.__esModule = true;
exports.composeWithDevTools = function() { exports.composeWithDevTools = function () {
if (typeof window !== 'undefined' && window.__REDUX_DEVTOOLS_EXTENSION__) { if (typeof window !== 'undefined' && window.__REDUX_DEVTOOLS_EXTENSION__) {
if (arguments.length === 0) return enhancer(); if (arguments.length === 0) return enhancer();
if (typeof arguments[0] === 'object') return composeWithEnhancer(arguments[0]); if (typeof arguments[0] === 'object')
return composeWithEnhancer(arguments[0]);
return composeWithEnhancer().apply(null, arguments); return composeWithEnhancer().apply(null, arguments);
} }
@ -49,8 +50,11 @@ exports.composeWithDevTools = function() {
return compose.apply(null, arguments); return compose.apply(null, arguments);
}; };
exports.devToolsEnhancer = ( exports.devToolsEnhancer =
typeof window !== 'undefined' && window.__REDUX_DEVTOOLS_EXTENSION__ ? typeof window !== 'undefined' && window.__REDUX_DEVTOOLS_EXTENSION__
enhancer : ? enhancer
function() { return function(noop) { return noop; } } : function () {
); return function (noop) {
return noop;
};
};

View File

@ -1 +1 @@
export * from "redux-devtools-extension"; export * from 'redux-devtools-extension';

View File

@ -1,25 +1,28 @@
"use strict"; 'use strict';
var compose = require('redux').compose; var compose = require('redux').compose;
var logOnly = require('./logOnly'); var logOnly = require('./logOnly');
exports.__esModule = true; exports.__esModule = true;
exports.composeWithDevTools = ( exports.composeWithDevTools =
process.env.NODE_ENV === 'production' ? logOnly.composeWithDevTools : process.env.NODE_ENV === 'production'
typeof window !== 'undefined' && ? logOnly.composeWithDevTools
window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ ? : typeof window !== 'undefined' &&
window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ : window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__
function() { ? window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__
: function () {
if (arguments.length === 0) return undefined; if (arguments.length === 0) return undefined;
if (typeof arguments[0] === 'object') return compose; if (typeof arguments[0] === 'object') return compose;
return compose.apply(null, arguments); return compose.apply(null, arguments);
} };
);
exports.devToolsEnhancer = ( exports.devToolsEnhancer =
process.env.NODE_ENV === 'production' ? logOnly.devToolsEnhancer : process.env.NODE_ENV === 'production'
typeof window !== 'undefined' && ? logOnly.devToolsEnhancer
window.__REDUX_DEVTOOLS_EXTENSION__ ? : typeof window !== 'undefined' && window.__REDUX_DEVTOOLS_EXTENSION__
window.__REDUX_DEVTOOLS_EXTENSION__ : ? window.__REDUX_DEVTOOLS_EXTENSION__
function() { return function(noop) { return noop; } } : function () {
); return function (noop) {
return noop;
};
};

View File

@ -1,4 +1,6 @@
var objectKeys = Object.keys || function (obj) { var objectKeys =
Object.keys ||
function (obj) {
var keys = []; var keys = [];
for (var key in obj) { for (var key in obj) {
if ({}.hasOwnProperty.call(obj, key)) keys.push(key); if ({}.hasOwnProperty.call(obj, key)) keys.push(key);