2016-01-07 4 views
9

Я использую Реагировать + Redux + Webpack + WebpackDevserver. После запуска горячего загрузчика все мои редукторы возвращаются в исходное состояние.Redux - как сохранить состояние редуктора во время горячей перезагрузки

Могу ли я как-то сохранить свои редукторы в фактическом состоянии?

Моего Webpack конфигурация содержит:

entry: [ 
    "./index.jsx" 
], 
output: { 
    filename: "./bundle.js" 
}, 
module: { 
    loaders: [ 
     { 
      test: /\.js|\.jsx$/, 
      exclude: /node_modules/, 
      loaders: ["react-hot","babel-loader"], 
     } 
    ] 
}, 
plugins: [ 
    new webpack.HotModuleReplacementPlugin() 
] 

My редукторов статистик с:

const initialState = { 
... 
} 

export default function config(state = initialState, action) { ... 

Я начинаю свой Webpack Dev-сервер просто:

"start": "webpack-dev-server", 

ответ

14

Предполагая, что Бабель 6, вы необходимо что-то сделать:

import {createStore} from 'redux'; 
import rootReducer from '../reducers'; 

export default function configureStore(initialState) { 
    const store = createStore(rootReducer, initialState); 

    if(module.hot) { 
    // Enable Webpack hot module replacement for reducers 
    module.hot.accept('../reducers',() => { 
     const nextReducer = require('../reducers/index').default; 

     store.replaceReducer(nextReducer); 
    }); 
    } 

    return store; 
} 

Вы можете увидеть подход в действии на моем redux demo.

+1

Это похоже только на поддержку редукторов, горячую перезагрузку, как горячую перезагрузку для контейнера, компонентов и действий? – ruandao

+3

Контейнеры и компоненты могут проходить через [реактивный нагреватель] (https://github.com/gaearon/react-hotloader). Это немного экспериментальная технология. Вопрос был ограничен редукторами, поэтому был ограниченный ответ. –

Смежные вопросы