mirror of
https://github.com/reduxjs/redux-devtools.git
synced 2025-02-07 15:10:45 +03:00
Add DevTools to the counter example
This commit is contained in:
parent
644cd6fab6
commit
0a2a97556e
|
@ -1,20 +1,34 @@
|
||||||
import React, { Component } from 'react';
|
import React, { Component } from 'react';
|
||||||
import CounterApp from './CounterApp';
|
import CounterApp from './CounterApp';
|
||||||
import { createStore, applyMiddleware, combineReducers } from 'redux';
|
import { createStore, applyMiddleware, combineReducers, compose } from 'redux';
|
||||||
|
import { devTools, persistState } from 'redux-devtools';
|
||||||
|
import { DevTools, DebugPanel, LogMonitor } from 'redux-devtools/lib/react';
|
||||||
import thunk from 'redux-thunk';
|
import thunk from 'redux-thunk';
|
||||||
import { Provider } from 'react-redux';
|
import { Provider } from 'react-redux';
|
||||||
import * as reducers from '../reducers';
|
import * as reducers from '../reducers';
|
||||||
|
|
||||||
const createStoreWithMiddleware = applyMiddleware(thunk)(createStore);
|
const finalCreateStore = compose(
|
||||||
|
applyMiddleware(thunk),
|
||||||
|
devTools(),
|
||||||
|
persistState(window.location.href.match(/[?&]debug_session=([^&]+)\b/)),
|
||||||
|
createStore
|
||||||
|
);
|
||||||
|
|
||||||
const reducer = combineReducers(reducers);
|
const reducer = combineReducers(reducers);
|
||||||
const store = createStoreWithMiddleware(reducer);
|
const store = finalCreateStore(reducer);
|
||||||
|
|
||||||
export default class App extends Component {
|
export default class App extends Component {
|
||||||
render() {
|
render() {
|
||||||
return (
|
return (
|
||||||
<Provider store={store}>
|
<div>
|
||||||
{() => <CounterApp />}
|
<Provider store={store}>
|
||||||
</Provider>
|
{() => <CounterApp />}
|
||||||
|
</Provider>
|
||||||
|
<DebugPanel top right bottom>
|
||||||
|
<DevTools store={store}
|
||||||
|
monitor={LogMonitor} />
|
||||||
|
</DebugPanel>
|
||||||
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -19,7 +19,9 @@ module.exports = {
|
||||||
],
|
],
|
||||||
resolve: {
|
resolve: {
|
||||||
alias: {
|
alias: {
|
||||||
'redux-devtools': path.join(__dirname, '..', '..', 'src')
|
'redux-devtools/lib': path.join(__dirname, '..', '..', 'src'),
|
||||||
|
'redux-devtools': path.join(__dirname, '..', '..', 'src'),
|
||||||
|
'react': path.join(__dirname, 'node_modules', 'react')
|
||||||
},
|
},
|
||||||
extensions: ['', '.js']
|
extensions: ['', '.js']
|
||||||
},
|
},
|
||||||
|
|
Loading…
Reference in New Issue
Block a user