title: React Redux Cannot read property 'dispatch' of undefined
body: <p>I did some updates to my app's packages like:</p>
  
  <pre><code>"react-redux": "^5.0.6" =&gt; "^6.0.1",
  "redux": "^3.7.2" =&gt; "^4.0.1",
  "redux-saga": "^0.16.0" =&gt; "^1.0.1"
  </code></pre>
  
  <p>but I get the error </p>
  
  <blockquote>
    <p>Cannot read property 'dispatch' of undefined</p>
  </blockquote>
  
  <p>This is my index.js:</p>
  
  <pre><code>import React from 'react';
  import ReactDOM from 'react-dom';
  import { createStore, applyMiddleware } from 'redux';
  import thunk from 'redux-thunk';
  import createSagaMiddleware from 'redux-saga';
  import { Provider } from 'react-redux';
  import { Route } from 'react-router-dom';
  import { ConnectedRouter, routerMiddleware } from 'react-router-redux';
  import createHistory from 'history/createHashHistory';
  import { writeSaga } from './sagas/writeSaga';
  import { readSaga } from './sagas/readSaga';
  
  import App from './App';
  import reducers from './reducers';
  
  const history = createHistory();
  const sagaMiddleware = createSagaMiddleware();
  const middlewares = [routerMiddleware(history), thunk, sagaMiddleware];
  const store = createStore(reducers, applyMiddleware(...middlewares));
  
  export default function*  rootSaga() {
    yield [
      writeSaga(),
      readSaga(),
    ]
  };
  sagaMiddleware.run(rootSaga);
  
  ReactDOM.render(
    &lt;Provider store={store}&gt;
      &lt;ConnectedRouter history={history}&gt;
        &lt;Route path="/" component={App} /&gt;
      &lt;/ConnectedRouter&gt;
    &lt;/Provider&gt;,
    document.getElementById('app-container')
  );
  </code></pre>
  
  <p>Here I get the error (react-router-redux ConnectedRouter.js):
  <a href="https://i.stack.imgur.com/tES1v.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/tES1v.png" alt="debugger"></a></p>
  
  <p>Any suggestions?</p>
  
  <p><strong>UPDATE 1</strong>
  Adding/removing packages, I understood that the package that causes that issue is the upgrade of "react-redux" (5.0.6 => 6.0.1)</p>
  
  <p><strong>UPDATE 2</strong>
  Watching the breaking changes of react-redux, I was able to understood that the problem was how I pass the store (<a href="https://github.com/reduxjs/react-redux/releases/tag/v6.0.0" rel="nofollow noreferrer">breaking changes</a>).</p>
  
  <p>I changed my code to:</p>
  
  <pre><code>ReactDOM.render(
    &lt;Provider store={store}&gt;
      &lt;ConnectedRouter history={history} store={store}&gt;
        &lt;Route path="/" component={App} store={store} /&gt;
      &lt;/ConnectedRouter&gt;
    &lt;/Provider&gt;,
    document.getElementById('app-container')
  );
  </code></pre>
  
  <p>And it works! </p>
  
  <p>But I know it isn't the correct way... maybe it can be useful for the right solution.</p>
  
  <p><strong>Why this isn't a duplicate of the other <a href="https://stackoverflow.com/questions/44093898/react-router-redux-connectedrouter-not-updating-with-route-change">question</a>:</strong> I have the same config to index, I checked it and I'm sure that I'm using react-router-redux.
  In every page I export like</p>
  
  <pre><code>export default connect(mapDispatchToProps)(Home);
  </code></pre>