我正在使用以下样板示例，并且尝试将其配置为与redux devtools的chrome扩展一起使用：
import { createStore, applyMiddleware } from 'redux'
import thunkMiddleware from 'redux-thunk'
import apiMiddleware from '../middleware/api'
import createLogger from 'redux-logger'
import rootReducer from '../reducers'
const logger = createLogger({
level: 'info',
collapsed: false,
logger: console,
predicate: (getState, action) => true
})
const createStoreWithMiddleware = applyMiddleware(
thunkMiddleware,
apiMiddleware,
logger
)(createStore)
export default function configureStore(initialState) {
const store = createStoreWithMiddleware(rootReducer, initialState)
if (module.hot) {
// Enable Webpack hot module replacement for reducers
module.hot.accept('../reducers', () => {
const nextRootReducer = require('../reducers')
store.replaceReducer(nextRootReducer)
})
}
return store
}
我尝试将其添加如下，但出现了窗口未定义的错误：
import { compose, createStore, applyMiddleware } from 'redux'
const createStoreWithMiddleware = compose(applyMiddleware(
thunkMiddleware,
apiMiddleware,
logger
),window.devToolsExtension ? window.devToolsExtension() : f => f)(createStore)
我假设该结构与reudx-devtools扩展示例页面中给出的结构有所不同，但是我不能指望它。
如何以正确的方式设置具有中间件和增强功能的商店？
typeof window === 'object' && typeof window.devToolsExtension !== 'undefined'
? window.devToolsExtension()
: f => f
这应该可以修复该错误。
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句