Redux 开发工具 Chrome 扩展 Immutable.js 导致错误

Posted

技术标签:

【中文标题】Redux 开发工具 Chrome 扩展 Immutable.js 导致错误【英文标题】:Redux Dev Tools Chrome Extension Immutable.js Causes Error 【发布时间】:2016-08-25 07:26:19 【问题描述】:

目前,我的 redux 设置(它使用 Immutable.js 的状态)完全按照需要运行。但是,redux 开发工具扩展在打开时会输出以下错误:

reducer 发生错误 TypeError: n.withMutations 不是函数

对于上下文,我使用 redux-immutable 来实现它的 combine reducers 功能,好吧,组合我的 react-router-redux reducer:

import  fromJS  from 'immutable';
import  LOCATION_CHANGE  from 'react-router-redux';

const initialState = fromJS(
  locationBeforeTransitions: null,
);

export default (state = initialState, action) => 
  if (action.type === LOCATION_CHANGE) 
    return state.merge(
      locationBeforeTransitions: action.payload,
    );
  
  return state;
;

还有我的业务逻辑减速器。

更新:使用 webpack 构建生产包,在生产模式下测试应用程序(在 docker 容器中),并在开发模式下再次测试应用程序(在没有 docker 的本地机器上)似乎已经解决了问题?奇怪...

【问题讨论】:

以下答案是否解决了这个问题?如果足够,您能否更新状态或接受答案 【参考方案1】:

如果要使用react-router-redux,不需要自己实现reducer, 只需从react-router-redux 导入 routerReducer 作为关键路由(重要),如下所示并与其他减速器结合,

import  syncHistoryWithStore, routerReducer  from 'react-router-redux'
// Add the reducer to your store on the `routing` key
const store = createStore(
  combineReducers(
    ...reducers,
    routing: routerReducer
  )
)

//To Sync navigation events with the store
const history = syncHistoryWithStore(browserHistory, store)

ReactDOM.render(
  <Provider store=store>
     /* Tell the Router to use our enhanced history */ 
    <Router history=history>
      <Route path="/" component=App>
        <Route path="foo" component=Foo/>
        <Route path="bar" component=Bar/>
      </Route>
    </Router>
  </Provider>,
  document.getElementById('mount')
)

希望这是您要实现的目标

【讨论】:

以上是关于Redux 开发工具 Chrome 扩展 Immutable.js 导致错误的主要内容,如果未能解决你的问题,请参考以下文章

如何在运行 React 的 Chrome 扩展中运行 Redux DevTools 扩展?

Redux 开发工具扩展导出失败“失败:网络错误”

chrome浏览器安装redux-devtools调试工具

React-安装和配置redux调试工具Redux DevTools

如何启用 Redux Devtools?

Redux 开发工具不适用于大型操作负载