CODEWITHSUNDEEP
javascriptreactjsreact-routerreact-router-domhistory.js
Lucas Andrade
Lucas Andrade

Reputation: 4580

Why on react history createHashHistory appends /# for each path?

I have an application with this config for history:

import { createHashHistory } from 'history';
import { ConnectedRouter } from 'connected-react-router';

const history = createHashHistory({
  hashType: 'slash',
});
    ...
  <ConnectedRouter history={history}>
    <App />
  </ConnectedRouter>

But all my routes get appended by /# ex: localhost:8080/ becomes: localhost:8080/#/

I already tried to update my packages as this question say but it didn't work.

The only thing that worked was change createHashHistory to createBrowserHistory, but I'm not sure what's the difference between them, and why createHashHistory is appending the /#

Upvotes: 0

Views: 6116

Answers (1)

vcycyv
vcycyv

Reputation: 620

With hashHistory, it produces url like http://yourwebsite.net/#page/xxx

With browserHistory, it produces url like http://yourwebsite.net/page/xxx

Which one to use? In real-world products, browserHistory is mostly used. A rule of thumb is "if you are using a dynamic server that can handle dynamic URLs then you need to use the BrowserRouter component but if you are using a server that only serves static files then a HashRouter component is what to be used in this case."

In your code, hashType: 'slash' is just the default value.

Upvotes: 4

Related Questions