Cannot read property 'listen' of undefined at syncHistoryWithStore

[zhoujinhai]

I have get the error when I am using syncHistoryWithStore , some one can help me!

import React from 'react' //引入React
import ReactDOM from 'react-dom' //引入render方法
import {Provider} from 'react-redux' //利用Provider讲store传递给所有组件
import {Router,browserHistory} from 'react-router';
import {syncHistoryWithStore} from 'react-router-redux'

import finalCreateStore from './store/configureStore.js'//引入store配置
import DevTools from './containers/DevTools'//引入Redux调试工具DevTools
import reducer from './reducers'//引入reducers集合
import routes from './routes'//引入路由配置

import './public/css/bootstrap.min.css' //引入样式文件

//给store传入reducer
const store = finalCreateStore(reducer); 

//创建一个history来结合store同步导航事件
const history = syncHistoryWithStore(browserHistory,store);

ReactDOM.render(
    <Provider store={store}>
        <div>
            //渲染路由
            <Router history={history} routes={routes} />
            //渲染调试组件
            <DevTools />
        </div>
    </Provider>,
    document.getElementById('test')
)

the package.json is follow:

{
  "name": "redux-exercise",
  "version": "1.0.0",
  "description": "the simple example of react-redux",
  "main": "index.js",
  "scripts": {
    "start": "webpack-dev-server --history-api-fallback --no-info --open",
    "build": "webpack",
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "zjh",
  "license": "ISC",
  "dependencies": {
    "antd": "^2.13.1",
    "bootstrap": "^3.3.7",
    "jquery": "^3.2.1",
    "react": "^15.6.1",
    "react-dom": "^15.6.1",
    "react-redux": "^5.0.6",
    "react-router": "^4.2.0",
    "react-router-redux": "^4.0.8",
    "redux": "^3.7.2",
    "redux-logger": "^3.0.6",
    "redux-thunk": "^2.2.0"
  },
  "devDependencies": {
    "babel-core": "^6.26.0",
    "babel-eslint": "^8.0.0",
    "babel-loader": "^7.1.2",
    "babel-plugin-antd": "^0.5.1",
    "babel-plugin-transform-object-assign": "^6.22.0",
    "babel-preset-es2015": "^6.24.1",
    "babel-preset-react": "^6.24.1",
    "babel-preset-stage-1": "^6.24.1",
    "css-loader": "^0.28.7",
    "eslint": "^4.7.0",
    "eslint-config-rackt": "^1.1.1",
    "eslint-plugin-react": "^7.3.0",
    "file-loader": "^0.11.2",
    "font-awesome": "^4.7.0",
    "jsx-loader": "^0.13.2",
    "redux-devtools": "^3.4.0",
    "redux-devtools-dock-monitor": "^1.1.2",
    "redux-devtools-log-monitor": "^1.3.0",
    "style-loader": "^0.18.2",
    "url-loader": "^0.5.9",
    "webpack": "^2.7.0",
    "webpack-dev-server": "^2.8.2",
    "whatwg-fetch": "^2.0.3"
  }
}

[timdorr]

This is a bug tracker, not a support system. For usage questions, please use Stack Overflow or Reactiflux. Thanks!

[timdorr]

Also, you're using the wrong versions together. react-router-redux 4.x doesn't work with React Router 4.x. Upgrade to react-router-redux@next and use the new API, or downgrade to React Router 3.0

[zhoujinhai]

Thanks