npm install --save redux redux-react-hook
npm install --save-dev redux-devtools-extension
import React from 'react' | |
import ReactDOM from 'react-dom' | |
import { StoreContext } from 'redux-react-hook' | |
import App from './App' | |
import store from './store/configureStore' | |
import prestate from './store/prestate' | |
const app = (state = {}) => { | |
ReactDOM.render( | |
<StoreContext.Provider value={store(prestate(state))}> | |
<App /> | |
</StoreContext.Provider>, | |
document.getElementById('root'), | |
) | |
} | |
if (process.env.NODE_ENV !== 'production' && module.hot) { | |
module.hot.accept('./App', app) | |
} | |
export { app } |
import { applyMiddleware, createStore } from 'redux' | |
import { composeWithDevTools } from 'redux-devtools-extension' | |
import rootReducer from './reducers' | |
export default function configureStore(preloadedState) { | |
const middlewares = [] | |
const middlewareEnhancer = applyMiddleware(...middlewares) | |
const enhancers = [middlewareEnhancer] | |
const composedEnhancers = composeWithDevTools(...enhancers) | |
const store = createStore(rootReducer, preloadedState, composedEnhancers) | |
if (process.env.NODE_ENV !== 'production' && module.hot) { | |
module.hot.accept('./reducers', () => store.replaceReducer(rootReducer)) | |
} | |
return store | |
} |
import modelPlayer from 'model/player' | |
const prestate = state => { | |
return { | |
...state, | |
player:modelPlayer(state.player) | |
} | |
} | |
export default prestate |
import { combineReducers } from 'redux' | |
import { player } from 'reducers' | |
const rootReducer = combineReducers({ | |
player | |
}) | |
export default rootReducer |