使用React Native和Redux重新加载Reducer时堆栈溢出
问题描述:
我使用Redux
与React Native和HMR
。当我改变一个减速器,接受泡到我configureStore.js
文件,该文件调用此:使用React Native和Redux重新加载Reducer时堆栈溢出
if (module.hot) {
module.hot.accept(() => {
const nextRootReducer = require('../reducers/index').default;
store.replaceReducer(nextRootReducer);
});
}
但随后HMR不断寻找在一个循环引用,直到堆栈溢出。 是不是有一个循环引用的地方?如果是这样,任何提示追踪它?我尝试了一下require.js
代码,但'参考'被保存为数字,因此难以追踪正确的文件。
答
这里是我的确切的代码,如果你要检查它:
export default function configureStore() {
engine = createEngine('appstate');
engine = filter(engine, null, ['appStateLoaded', 'appReady', 'tourReady', 'tourPage', 'tooltipStep', 'connected']);
const cacheState = storage.createMiddleware(engine); //OLD PARAMETER: , [LOAD, 'SET_TOUR_READY', 'SET_TOUR_PAGE'] ... replaced by reducer key filtering above instead
enhancer = compose(
applyMiddleware(thunk, cacheState),
devTools({
name: Platform.OS,
hostname: '10.0.1.201',
port: 5678,
filters: {blacklist: ['REDUX_STORAGE_SAVE']}
})
);
//reset reducer state on LOGOUT
const appReducer = combineReducers(reducers);
const rootReducer = (state, action) => {
if (action.type === LOGOUT) {
state = undefined;
}
return appReducer(state, action);
}
reducer = storage.reducer(rootReducer);
store = createStore(reducer, enhancer);
//retreive previously cached state and inject into Redux store!
const load = storage.createLoader(engine);
load(store)
.then((newState) => console.log('Loaded state:', newState))
.catch(() => console.log('Failed to load previous state'));
if(module.hot) {
module.hot.accept(() => {
let nextRootReducer = storage.reducer(rootReducer);
store.replaceReducer(nextRootReducer);
load(store)
.then((newState) => console.log('Loaded state:', newState))
});
}
return store;
}
它应该给你如何使用各种中间件module.hot.accept
了坚实的例子。 ......就“循环引用”而言 - 唯一要做的就是检查你的reducer并确保它们不会导入对方。我想我已经看到了这个确切的问题 - ES6模块可以正确解决初始构建周期问题,但也许HMR构建过程不能。就这样。所以你最终认为你的代码有效,但它基本上不支持HMR。我会设置一个快速测试应用程序并实施他们的hot.module.accept
代码并验证它适用于您。也许你必须调整一件事 - 但由于代码很少,所以很容易找到 - 然后在自己的代码中进行相同的修复。如果这不能解决问题,那么请暂时将您在应用中使用redux所做的工作减至最少,直到找出造成问题的原因为止。 ..我希望对你有更多的建议。
我有类似的问题。对于我来说,最初的'store'对象变得未定义,但是,当你直接使用'store'时,这是一个问题。起初,这是唯一的问题,但随着时间的推移,当我更新减速器时,现在它们一起崩溃(死亡的红幕)。我假设来自添加诸如'redux-storage'或其他中间件的软件包。更新操作甚至更成为一个问题 - 这些问题从未奏效。我的假设是我需要在传递给'module.hot.accept'的函数中做更多的事情。即重做我最初在'configureStore'中做的所有事情。 –
更新:你的问题让我再次思考这个问题,我终于解决了它大声笑。不知道它是否适用于您,但我所做的是2件事:我完全按照我的假设做了我没有用redux存储适当地重新配置商店的地方,所以我这样做了。即我确保所有先前设置reducer的步骤都是在'module.hot.accept'中完成的。然后,就行动而言,我停止将它们导入到我的'configureStore'文件中,因为我没有使用它们 - 解决了更改我的操作文件使商店崩溃的问题,该问题无法正确“接受”变化。 –