As orientações não funcionam mais na versão atual do react-router

Oi Bruno, vou parar para ver isso certinho e atualizar o que for necessario no texto.

Infelizmente não consegui prosseguir com o curso, pois os passos dados pelo professor não estão funcionando.

Espero resolução para realizar a finalização do curso.

Oi Adonai, vc usou a versão 2 do router? pergunto pq essa é justamente a que está especificada no curso. Vou trabalhar para atualizar o curso, mas os conceitos são os mesmos, não precisa parar por conta disso.

Basta rodar o npm install assim:

npm install react-router@2.7.0

Pessoal, me ajudem aqui. Qual é exatamente o problema que está dando no projeto de vocês com a versão atual do router?

O meu até que está funcionando na 2.7.0 mais está apresentando 2 warnings:

warning.js:36 Warning: Accessing PropTypes via the main React package is deprecated. Use the prop-types package from npm instead.

warning.js:36 Warning: RouterContext: React.createClass is deprecated and will be removed in version 16. Use plain JavaScript classes instead. If you're not yet ready to migrate, create-react-class is available on npm as a drop-in replacement.

Obrigado Elias, isso vem da atualização do React mesmo. Vou colocar uma nota na explicação! Quem teve problemas com o router, tenta me explicar exatamente o que apareceu também :).

Alberto eu atualizei pra versão 4.0.0, que segundo o github do react-router é a última, e foi apresentado os seguintes erros (espero que seja isso que você esteja perguntando de fato):

Warning: Failed prop type: The prop `history` is marked as required in `Router`, but its value is `undefined`.
    in Router (at index.js:11)
printWarning @ bundle.js:11907


bundle.js:34184 Uncaught TypeError: Cannot read property 'location' of undefined
    at new Router (bundle.js:34184)
    at bundle.js:26449
    at measureLifeCyclePerf (bundle.js:26229)
    at ReactCompositeComponentWrapper._constructComponentWithoutOwner (bundle.js:26448)
    at ReactCompositeComponentWrapper._constructComponent (bundle.js:26434)
    at ReactCompositeComponentWrapper.mountComponent (bundle.js:26342)
    at Object.mountComponent (bundle.js:18760)
    at ReactCompositeComponentWrapper.performInitialMount (bundle.js:26525)
    at ReactCompositeComponentWrapper.mountComponent (bundle.js:26412)
    at Object.mountComponent (bundle.js:18760)

Eu instalei o "react-router" mais parece que ele é voltado para React Native que visa a plataforma Mobile, e eles pedem para usar o "react-router-dom" para Web.

Vou reinstalar e verificar os problemas.

Opa Elias, obrigado. Era isso mesmo :). Eles criaram o react-router-dom agora, voltado para web... O router ficou só o core... Valeu pela ajuda!

Fala Alberto... então eu ralei aqui e cheguei a seguinte definição, que funcionou (se tiver algo que eu fiz errado me avise):

index.js:

import React from 'react';
import ReactDOM from 'react-dom';
import App from './App';
import './index.css';

ReactDOM.render(
  <App />,
  document.getElementById('root')
);

App.js:

import React, { Component } from 'react';
import './css/pure-min.css';
import './css/side-menu.css';
import { BrowserRouter as Router, Route, Link } from 'react-router-dom'
import AutorBox from './Autor';
import Home from './Home';
import LivroBox from './Livro';

export default class App extends Component {

  render() {
    return (      

      <Router>
        <div id="layout">
          <a href="#menu" id="menuLink" className="menu-link">
            <span></span>
          </a>

          <div id="menu">
            <div className="pure-menu">
              <a className="pure-menu-heading" href="#">Company</a>

              <ul className="pure-menu-list">
                <li className="pure-menu-item"><Link to="/" className="pure-menu-link">Home</Link></li>
                <li className="pure-menu-item"><Link to="/autor" className="pure-menu-link">Autor</Link></li>
                <li className="pure-menu-item"><Link to="/livro" className="pure-menu-link">Livro</Link></li>
              </ul>

            </div>
          </div>

          <Route exact path="/" component={Home} />
          <Route path="/autor" component={AutorBox} />
          <Route path="/livro" component={LivroBox} />
        </div>
      </Router>
    );
  }
}

Alberto, por gentileza atualize o curso, as instruções não estão corretas, pois quando instalamos o react-router(Que pode até funcionar, mas é mais fácil usar react-router-dom) nenhum ponto que tu menciona funciona mais, tendo em vista a versão >4 . Coloquei do jeito que @Elias Gervasio mencionou e funcionou. Contudo gostaria de saber como faz para colocar o Router no index.js com a hierarquia, entende...

Pessoal, o curso foi gravado dando suporte ate a versao 3, inclusive especificado no exercicio do router. O 4 mudou coisas que necessitam uma nova organizacao, por enquanto impossibilitando a atualizacao rapida. Deixei inclusive uma observacao no exercicio.

Obrigado a todos pelas observacoes.

esse video me ajudou: https://www.youtube.com/watch?v=Zjacr7_GZR0

espero que em breve o professor roberto post algo mais didatico e explique as mudanças no RR4

Alberto, tentei usar a 2.7 mas ocorre o seguinte erro: "Module not found: [CaseSensitivePathsPlugin] `"

Opa, module not found gera eh reflexo da falta de algum npm install. Eu apagaria a pasta node_modules e mandaria o npm install de novo.