React Router: Cannot read property 'pathname' of undefined

I had the same error and I resolved it by updating history from 2.x.x to 4.x.x

npm install history@latest --save

I got the above error message and it was extremely cryptic. I tried the other solutions mentioned and it didn't work.

Turns out I accidentally forgot to include the to prop in one of the <Link /> components.

Wish the error message was better. A simple required prop "to" not found or something like that would have been helpful. Hopefully this saves someone else who has encountered the same problem some time.

The error is because the api in React Router v4 is totally different. You can try this:

import React from 'react';
import ReactDOM from 'react-dom';
import {
  BrowserRouter as Router,
  Route
} from 'react-router-dom';

const Main = () => <h1>Hello world</h1>;

ReactDOM.render(
  <Router>
    <Route path='/' component={Main} />
  </Router>,
  document.getElementById('app')
);

You can review the documentation to learn how it works now.

Here I have a repo with routing animation.

And here you can find a live demo.

Just make sure that you've added to props to <Link> otherwise you would also get the same error.

after adding it should look something like this:-

<Link to="#">