What caused this warning in react-router?

Question

browser.js: Warning: [react-router] the History mixin is deprecated, please access context.router with your own contextTypes.

My routes file

const routes = (
  <Provider store={store}>
      <Router history={browserHistory}>
        <Route path="/" component={RootComponent}>
          <IndexRoute component={HomePage} />

          <Route path="profile" component={ProfilePage} >
            <IndexRoute component={ProfilePage} />
            <Route path="view/:profileId" component={ProfilePage} />
            <Route path="add" component={AddProfile} />
            <Route path="edit/:profileId" component={EditProfile} />
          </Route>

          <Route path="login" component={Login} />
          <Route path="onboard" component={Onboard} />
        </Route>
      </Router>
  </Provider>
);

export default routes;

And root

import React from 'react';
import { render } from 'react-dom';
import routes from './routes';
import "babel-polyfill";

const mountPoint = document.getElementById('application-root');

if (mountPoint) {
  render(routes, mountPoint);
} else {
  console.error('could not find application mount point');
}

React-router v2.6.1

Put a breakpoint on the line that emits that warning and check the stack trace up to the place where this thing is checked. Then you know what exactly causes it. — zerkms, Aug 02 '16 at 22:36

score 1 · Answer 1 · answered Aug 03 '16 at 08:35

The error might be caused by this line. Where are you importing 'browserHistory' from?

<Router history={browserHistory}>

In the latest version of react-router, you need to import history from react-router package itself

import { browserHistory } from 'react-router'

<Router history={browserHistory} routes={routes} />

Refer this link for further details

What caused this warning in react-router?

1 Answers1