Solucionando react-router

Pessoal, ao chegar ao módulo de react-router tive uma grande dificuldade de realizar a aplicação funcionar conforme a aula, verifiquei no fórum o aluno Hilton Figueiredo Barbosa fez uma ótima solução para o {this.props.children}, porém ele não tratou o histórico e a hierarquia. Segue abaixo o complemento do código que trata o problema de versão do react-router no index.js.

import React from 'react';
import ReactDOM from 'react-dom';
import { BrowserRouter, Route } from 'react-router-dom'
import createBrowserHistory from 'history/createBrowserHistory'

import './index.css';

import App from './App';
import Home from './Home';
import AutorBox from './Autor';

ReactDOM.render(
    <BrowserRouter history={createBrowserHistory}>
        <div>
            <App>
                <Route exact path="/" component={Home} />
                <Route path="/autor" component={AutorBox}/> 
                <Route path="/livro" /> 
            </App>
        </div>
    </BrowserRouter>,
    document.getElementById('root')
);

Para converter a versão 3 para a 4 usei como referencia o seguinte link: https://github.com/ReactTraining/react-router/blob/master/packages/react-router/docs/guides/migrating.md#patternutils Espero que ajude os outros alunos que estão fazendo esse curso.