Warning: [history] pushState is deprecated; use push instead

Question

when using a webpack + react + react-router + es6

Warning: [history] pushState is deprecated; use push instead

<pre>
import React from 'react';
import ReactDOM from 'react-dom';
import {createHistory} from 'history';
import App from './component/app';
import About from './component/about';
import Concat from './component/concat';
import List from './component/list';
import {Router, Route} from 'react-router';
const history = createHistory();
const router = (
    <Router history={history}>
        <Route path="/" component={App}>
            <Route path="about" component={About} />
            <Route path="concat" component={Concat} />
            <Route path="list/:id" component={List} />
            <Route path="*" component={About}/>
        </Route>
    </Router>
);

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

Answer 1

I had the same issue myself today, it's due to the new merge request to the History repo:

https://github.com/rackt/history/commit/a9db75ac71b645dbd512407d7876799b70cab11c

[TEMP FIX] Update your package.json, change "history" to "1.13.1" in dependencies. Do a "npm install" afterwards to update.

[REAL FIX] Wait until someone merges a fix into react-router.

Answer 2

In previous versions of History (npm install history) pushState was used. pushState is a feature of HTML5 concerning the updating of the URL without navigating to a page/template/component.

This was deprecated in honor of push('path'), which is a cleaner better syntax according to some.

Replace

this.history.pushState(null, "/route/") 

with

this.history.push('/store/' + storeId);