173

Both have Route, Link, etc. When to use one or the other? I'm really confused on where to use each one. Server side? Client side?

https://reacttraining.com/react-router/

In some examples you need to pass the history, in others not. What to do?

<Router history={browserHistory}>

vs

<Router>

It's really confusing on when to use one or the other, any help appreciated.

Venryx
  • 8,962
  • 7
  • 50
  • 61
chulian
  • 2,507
  • 3
  • 19
  • 22
  • 2
    [Why is "Can someone help me?" not an actual question?](https://meta.stackoverflow.com/questions/284236/why-is-can-someone-help-me-not-an-actual-question) – Robert Columbia Jul 07 '18 at 01:27

4 Answers4

202

react-router contains all the common components between react-router-dom and react-router-native. When should you use one over the other? If you're on the web then react-router-dom should have everything you need as it also exports the common components you'll need. If you're using React Native, react-router-native should have everything you need for the same reason. So you'll probably never have to import anything directly from react-router. As far as when you use 

<Router history={browserHistory}>

vs

<Router>

In RRv4 you won't need to pass down browserHistory, that was just for previous versions of the router.

If you're still confused, you can check out the details on each package here

Tyler McGinnis
  • 30,798
  • 16
  • 69
  • 74
  • 3
    shall we remove react-router from project or it affects react-router-dom?? is that react-router package is mandatory to work with react-router-dom? – Yogi Jun 22 '17 at 12:28
  • 4
    @snAtchnAren It's not mandatory. You should never need the "react-router" package if you've already installed "react-router-dom". – Tyler McGinnis Jun 22 '17 at 17:04
  • 3
    If I use react-router-dom over react-router, will it decrease the size of my bundle? – Vrishank May 23 '18 at 09:44
40

react-router-dom is a react-router plus:

Atombit
  • 654
  • 7
  • 10
20

Just use react-router-dom - react-router-dom re-exports all of react-router. The link on GitHub answer (what's the diff between react-router-dom & react-router?).

Rich Warrior
  • 1,310
  • 6
  • 17
Aleksandr Golovatyi
  • 601
  • 1
  • 7
  • 14
11

In v4, react-router exports the core components and functions. react-router-dom exports DOM-aware components, like <Link> ( which renders <a>) and (which interacts with the browser's window.history ).

react-router-dom re-exports all of react-router's exports, so you only need to import from react-router-dom in your project.

(Source: GitHub)

Deja
  • 3,278
  • 2
  • 18
  • 46
Sooraj
  • 6,517
  • 4
  • 51
  • 87