title: React Router v4. Route not visible.
body: <p>I was using <code>router v3</code> and started refactoring the routing logic according to <code>v4</code> in order to further implement <code>transition-groups</code> and came up with the following code. There is no error in while compiling or in the console, when I go to the <code>/#/about</code> it returns an empty page.</p>
  
  <p><strong>index.js</strong></p>
  
  <pre><code>import React from 'react';
  import ReactDOM from 'react-dom';
  import Store from './container/store/store';
  import Container from './container/container';
  
  
  const MOUNT_NODE = document.getElementById('root');
  
  const render = () =&gt; {
    const store = Store({});
  
    ReactDOM.render(
        &lt;Container store={store} /&gt;,
      MOUNT_NODE
    );
  };
  
  
  // Hot Module Replacement
  if (module.hot) {
    module.hot.accept('./routes/index', () =&gt;
      setImmediate(() =&gt; {
        ReactDOM.unmountComponentAtNode(MOUNT_NODE);
        render();
      })
      // This method is used to break up long running operations and run a callback function immediately after the browser has completed other operations such as events and display updates.
    );
  };
  
  render();
  </code></pre>
  
  <p><br>
  <strong>container.js (hooks up redux to the application)</strong></p>
  
  <pre><code>import React, { Component, PropTypes } from 'react';
  import { Provider } from 'react-redux';
  import { HashRouter, Switch, Route } from 'react-router-dom';
  
  
  // Wrap
  import Wrap from '../wrap';
  import Contact from '../routes/contact';
  
  
  export default class Container extends Component {
    static propTypes = {
      store: PropTypes.object.isRequired
    }
  
    shouldComponentUpdate() {
      return false;
    }
  
    render() {
      const { store } = this.props;
  
      return (
        &lt;Provider store={store}&gt;
          &lt;HashRouter&gt;
            &lt;Switch&gt;
              &lt;Route exact path='/' component={Wrap}/&gt;
            &lt;/Switch&gt;
            &lt;/HashRouter&gt;
        &lt;/Provider&gt;
      )
    }
  }
  </code></pre>
  
  <p><br>
  <strong>wrap.js (works as index route)</strong></p>
  
  <pre><code>import React, { Component } from 'react';
  import Header from '../components/header';
  import styles from './styles/styles.css';
  import { HashRouter, Switch, Redirect, Route, BrowserRouter, Link} from 'react-router-dom';
  
  import About from '../routes/about';
  
  
  export default class Wrap extends Component {
  
    constructor(props) {
      super(props);
    }
  
    render () {
  
      return (
        &lt;div&gt;
          &lt;Header location={this.props.location} /&gt;
          &lt;Route path='/about' component={About}/&gt;
          ... other stuff
        &lt;/div&gt;
      )
    }
  }
  </code></pre>