mirror of
https://github.com/reduxjs/redux-devtools.git
synced 2025-02-07 15:10:45 +03:00
Reflect Redux 3.1.0 changes in the README
This commit is contained in:
Dan Abramov
parent
72cd8d0505
commit
4333826cab
33
README.md
33
README.md
|
|
@ -81,7 +81,7 @@ const DevTools = createDevTools(
|
|||
|
||||
The `DevTools` component you created with `createDevTools()` has a special static method called `instrument()`. It returns a [store enhancer](http://rackt.github.io/redux/docs/Glossary.html#store-enhancer) that you need to use in development.
|
||||
|
||||
A store enhancer is a function that takes `createStore` and returns an enhanced version of it that you will use instead. You probably already used another store enhancer—[`applyMiddleware()`](http://redux.js.org/docs/api/applyMiddleware.html). Unlike `applyMiddleware()`, you will need to be careful to only use `DevTools.instrument()` in development environment, and never in production.
|
||||
A store enhancer is a function that enhances the behavior of `createStore()`. You can pass store enhancer as the last optional argument to `createStore()`. You probably already used another store enhancer—[`applyMiddleware()`](http://redux.js.org/docs/api/applyMiddleware.html). Unlike `applyMiddleware()`, you will need to be careful to only use `DevTools.instrument()` in development environment, and never in production.
|
||||
|
||||
The easiest way to apply several store enhancers in a row is to use the [`compose()`](http://redux.js.org/docs/api/compose.html) utility function that ships with Redux. It is the same `compose()` that you can find in Underscore and Lodash. In our case, we would use it to compose several store enhancers into one: `compose(applyMiddleware(m1, m2, m3), DevTools.instrument())`.
|
||||
|
||||
|
|
@ -94,15 +94,17 @@ import { createStore, applyMiddleware, compose } from 'redux';
|
|||
import rootReducer from '../reducers';
|
||||
import DevTools from '../containers/DevTools';
|
||||
|
||||
const finalCreateStore = compose(
|
||||
const enhancer = compose(
|
||||
// Middleware you want to use in development:
|
||||
applyMiddleware(d1, d2, d3),
|
||||
// Required! Enable Redux DevTools with the monitors you chose
|
||||
DevTools.instrument()
|
||||
)(createStore);
|
||||
);
|
||||
|
||||
export default function configureStore(initialState) {
|
||||
const store = finalCreateStore(rootReducer, initialState);
|
||||
// Note: only Redux >= 3.1.0 supports passing enhancer as third argument.
|
||||
// See https://github.com/rackt/redux/releases/tag/v3.1.0
|
||||
const store = createStore(rootReducer, initialState, enhancer);
|
||||
|
||||
// Hot reload reducers (requires Webpack or Browserify HMR to be enabled)
|
||||
if (module.hot) {
|
||||
|
|
@ -121,14 +123,14 @@ If you’d like, you may add another store enhancer called `persistState()`. It
|
|||
// ...
|
||||
import { persistState } from 'redux-devtools';
|
||||
|
||||
const finalCreateStore = compose(
|
||||
const enhancer = compose(
|
||||
// Middleware you want to use in development:
|
||||
applyMiddleware(d1, d2, d3),
|
||||
// Required! Enable Redux DevTools with the monitors you chose
|
||||
DevTools.instrument(),
|
||||
// Optional. Lets you write ?debug_session=<key> in address bar to persist debug sessions
|
||||
persistState(getDebugSessionKey())
|
||||
)(createStore);
|
||||
);
|
||||
|
||||
function getDebugSessionKey() {
|
||||
// You can write custom logic here!
|
||||
|
|
@ -182,14 +184,13 @@ if (process.env.NODE_ENV === 'production') {
|
|||
import { createStore, applyMiddleware, compose } from 'redux';
|
||||
import rootReducer from '../reducers';
|
||||
|
||||
const finalCreateStore = compose(
|
||||
// Middleware you want to use in production:
|
||||
applyMiddleware(p1, p2, p3),
|
||||
// Other store enhancers if you use any
|
||||
)(createStore);
|
||||
// Middleware you want to use in production:
|
||||
const enhancer = applyMiddleware(p1, p2, p3);
|
||||
|
||||
export default function configureStore(initialState) {
|
||||
return finalCreateStore(rootReducer, initialState);
|
||||
// Note: only Redux >= 3.1.0 supports passing enhancer as third argument.
|
||||
// See https://github.com/rackt/redux/releases/tag/v3.1.0
|
||||
return createStore(rootReducer, initialState, enhancer);
|
||||
};
|
||||
```
|
||||
|
||||
|
|
@ -201,14 +202,14 @@ import { persistState } from 'redux-devtools';
|
|||
import rootReducer from '../reducers';
|
||||
import DevTools from '../containers/DevTools';
|
||||
|
||||
const finalCreateStore = compose(
|
||||
const enhancer = compose(
|
||||
// Middleware you want to use in development:
|
||||
applyMiddleware(d1, d2, d3),
|
||||
// Required! Enable Redux DevTools with the monitors you chose
|
||||
DevTools.instrument(),
|
||||
// Optional. Lets you write ?debug_session=<key> in address bar to persist debug sessions
|
||||
persistState(getDebugSessionKey())
|
||||
)(createStore);
|
||||
);
|
||||
|
||||
function getDebugSessionKey() {
|
||||
// You can write custom logic here!
|
||||
|
|
@ -218,7 +219,9 @@ function getDebugSessionKey() {
|
|||
}
|
||||
|
||||
export default function configureStore(initialState) {
|
||||
const store = finalCreateStore(rootReducer, initialState);
|
||||
// Note: only Redux >= 3.1.0 supports passing enhancer as third argument.
|
||||
// See https://github.com/rackt/redux/releases/tag/v3.1.0
|
||||
const store = createStore(rootReducer, initialState, enhancer);
|
||||
|
||||
// Hot reload reducers (requires Webpack or Browserify HMR to be enabled)
|
||||
if (module.hot) {
|
||||
|
|
|
|||
|
|
@ -16,11 +16,11 @@
|
|||
},
|
||||
"homepage": "https://github.com/gaearon/redux-devtools#readme",
|
||||
"dependencies": {
|
||||
"react": "^0.14.0",
|
||||
"react-dom": "^0.14.0",
|
||||
"react-redux": "^4.0.0",
|
||||
"redux": "^3.0.0",
|
||||
"redux-thunk": "^1.0.0"
|
||||
"react": "^0.14.6",
|
||||
"react-dom": "^0.14.6",
|
||||
"react-redux": "^4.1.0",
|
||||
"redux": "^3.1.1",
|
||||
"redux-thunk": "^1.0.3"
|
||||
},
|
||||
"devDependencies": {
|
||||
"babel-cli": "^6.3.17",
|
||||
|
|
@ -31,8 +31,8 @@
|
|||
"babel-preset-stage-0": "^6.3.13",
|
||||
"node-libs-browser": "^0.5.2",
|
||||
"react-hot-loader": "^1.3.0",
|
||||
"redux-devtools": "^3.0.0",
|
||||
"redux-devtools-log-monitor": "^1.0.1",
|
||||
"redux-devtools": "^3.0.1",
|
||||
"redux-devtools-log-monitor": "^1.0.2",
|
||||
"redux-devtools-dock-monitor": "^1.0.1",
|
||||
"webpack": "^1.9.11",
|
||||
"webpack-dev-server": "^1.9.0"
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@ import thunk from 'redux-thunk';
|
|||
import rootReducer from '../reducers';
|
||||
import DevTools from '../containers/DevTools';
|
||||
|
||||
const finalCreateStore = compose(
|
||||
const enhancer = compose(
|
||||
applyMiddleware(thunk),
|
||||
DevTools.instrument(),
|
||||
persistState(
|
||||
|
|
@ -12,10 +12,10 @@ const finalCreateStore = compose(
|
|||
/[?&]debug_session=([^&]+)\b/
|
||||
)
|
||||
)
|
||||
)(createStore);
|
||||
);
|
||||
|
||||
export default function configureStore(initialState) {
|
||||
const store = finalCreateStore(rootReducer, initialState);
|
||||
const store = createStore(rootReducer, initialState, enhancer);
|
||||
|
||||
if (module.hot) {
|
||||
module.hot.accept('../reducers', () =>
|
||||
|
|
|
|||
|
|
@ -2,10 +2,8 @@ import { createStore, applyMiddleware, compose } from 'redux';
|
|||
import thunk from 'redux-thunk';
|
||||
import rootReducer from '../reducers';
|
||||
|
||||
const finalCreateStore = compose(
|
||||
applyMiddleware(thunk)
|
||||
)(createStore);
|
||||
const enhancer = applyMiddleware(thunk);
|
||||
|
||||
export default function configureStore(initialState) {
|
||||
return finalCreateStore(rootReducer, initialState);
|
||||
return createStore(rootReducer, initialState, enhancer);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -29,10 +29,10 @@
|
|||
"homepage": "https://github.com/gaearon/redux-devtools#readme",
|
||||
"dependencies": {
|
||||
"classnames": "^2.1.2",
|
||||
"react": "^0.14.0",
|
||||
"react-dom": "^0.14.0",
|
||||
"react-redux": "^4.0.0",
|
||||
"redux": "^3.0.0"
|
||||
"react": "^0.14.6",
|
||||
"react-dom": "^0.14.6",
|
||||
"react-redux": "^4.1.0",
|
||||
"redux": "^3.1.1"
|
||||
},
|
||||
"devDependencies": {
|
||||
"babel-cli": "^6.3.17",
|
||||
|
|
@ -44,8 +44,8 @@
|
|||
"node-libs-browser": "^0.5.2",
|
||||
"raw-loader": "^0.5.1",
|
||||
"react-hot-loader": "^1.3.0",
|
||||
"redux-devtools": "^3.0.0",
|
||||
"redux-devtools-log-monitor": "^1.0.1",
|
||||
"redux-devtools": "^3.0.1",
|
||||
"redux-devtools-log-monitor": "^1.0.2",
|
||||
"redux-devtools-dock-monitor": "^1.0.1",
|
||||
"style-loader": "^0.12.3",
|
||||
"todomvc-app-css": "^2.0.1",
|
||||
|
|
|
|||
|
|
@ -3,17 +3,17 @@ import { persistState } from 'redux-devtools';
|
|||
import rootReducer from '../reducers';
|
||||
import DevTools from '../containers/DevTools';
|
||||
|
||||
const finalCreateStore = compose(
|
||||
const enhancer = compose(
|
||||
DevTools.instrument(),
|
||||
persistState(
|
||||
window.location.href.match(
|
||||
/[?&]debug_session=([^&]+)\b/
|
||||
)
|
||||
)
|
||||
)(createStore);
|
||||
);
|
||||
|
||||
export default function configureStore(initialState) {
|
||||
const store = finalCreateStore(rootReducer, initialState);
|
||||
const store = createStore(rootReducer, initialState, enhancer);
|
||||
|
||||
if (module.hot) {
|
||||
module.hot.accept('../reducers', () =>
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user