title: history.listen not working correctly inside React Router
body: <p>I want to be able to call a function every time React recognises the url has changed, but am having trouble with history.listen not firing (the console.log is never printed). I have seen posts saying that this is because I'm using BrowserRouter, but I am getting errors saying "cannot find x inside react-router" whenever I try importing anything from react-router. I currently have react-router and react-router-dom versions 4.1.2</p>
  
  <p>App.js</p>
  
  <pre><code>import React, { Component } from 'react';
  import { Provider } from 'react-redux';
  import { createStore, applyMiddleware } from 'redux';
  import ReduxThunk from 'redux-thunk';
  import { BrowserRouter, Route, Redirect, Link } from 'react-router-dom';
  
  import './App.css';
  import reducers from './common/reducers'
  import Routes from './common/Routes';
  import RoutesWrapper from './components/RoutesWrapper';
  import Login from './Login';
  
  class App extends Component {
  
      render() {
          const store = createStore(reducers, {}, applyMiddleware(ReduxThunk));
  
          return (
              &lt;Provider store={store}&gt;
                  &lt;BrowserRouter&gt;
                      &lt;Login&gt;
                          &lt;div className="App"&gt;
                              &lt;div className="widgetCont"&gt;
                                  &lt;Routes wrapper={RoutesWrapper}/&gt;
                              &lt;/div&gt;
                          &lt;/div&gt;
                      &lt;/Login&gt;
                  &lt;/BrowserRouter&gt;
              &lt;/Provider&gt;
          );
      }
  }
  
  export default App;
  export { Route, Redirect, Link };
  </code></pre>
  
  <p>Routes.js</p>
  
  <pre><code>import React, { Component } from 'react';
  import createHistory from 'history/createBrowserHistory';
  
  import { Route } from '../App.js';
  import PredictionsCompletedContainer from './containers/PredictionsCompletedContainer';
  import GameContainer from './containers/GameContainer';
  
  class Routes extends Component {
  
  
      render() {
          const Wrapper = this.props.wrapper;
  
          const history = createHistory();
          history.listen((location, action) =&gt; {
              console.log("inside history listen");
          });
  
          return (
              &lt;Wrapper&gt;
                  &lt;Route exact path="/" component={GameContainer}/&gt;
                  &lt;Route path="/predictions-completed" component={PredictionsCompletedContainer}/&gt;
              &lt;/Wrapper&gt;
          );
      }
  }
  
  export default Routes;
  </code></pre>