warning in dev console in reactJS application

Question

In my react JS application I got this warning in console:

browser.js?26d3:49 Warning: <BrowserRouter> ignores the history prop. To use a custom history, use `import { Router }` instead of `import { BrowserRouter as Router }`.

I do it this way:

import {BrowserRouter as Router, hashHistory, Switch, NavLink, Route} from "react-router-dom";


render() {
    const {t} = this.props;
    return (
        <Provider store={store}>
            <AppContainer>
                <Router history={createHistory}>
                    <div>

If I do the above mentioned change in the warning the application does not run anymore and throws errors

one of the looks like this:

AppContainer.dev.js?cd84:95 TypeError: Cannot read property 'pathname' of undefined

How can I fix this?

Thanks in advance

Answer 1

You have two option here:

A: Use BrowserRouter and simply don't pass history to it:

<Router>

Or

import {BrowserRouter, hashHistory, Switch, NavLink, Route} from "react-router-dom";
...
<BrowserRouter>

B: Use Router and pass instantiated history object:

import {Router, hashHistory, Switch, NavLink, Route} from "react-router-dom";
const history = createHistory();
...
<Router history={history}>