v0.0.0-experimental-ffd8c7d0

This release is based on v6.0.0-beta.0 and adds a few features that are targeted at supporting React suspense for data loading. These features are:

• A timeoutMs prop that may be passed to a <BrowserRouter>, <HashRouter>, <MemoryRouter>, or <NativeRouter>. This timeout dictates how long these routers will wait before transitioning to a new page after the URL has changed. The default timeoutMs is 5000 (5 seconds).
• useLocationPending hook that returns true if a transition to a new location is pending
• <Route preload> function that is called whenever a route matches and is about to render. This function is typically used for pre-seeing client-side data caches for data retrieval later during rendering, which may trigger suspense.

Development on v6's experimental channel is happening on the dev-experimental branch, which tracks all changes that occur on the dev branch.

What does "experimental" mean?

React Router v6's experimental release channel follows the same semantics as React's own experimental channel, which means that it is used for features that are not yet ready for a stable release. Use the experimental releases to try out new features before they are released.

Installing

If you'd like to test it out, install from npm:

$ npm install history react-router-dom@experimental

Or, if you're on React Native:

$ yarn add history react-router-native@experimental

We are actively working on documentation. For now, if you're just interested in testing things out you may be interested in the getting started guide. If you're interested in upgrading an existing app, please check out the v5 to v6 migration guide. There is also a comprehensive API Reference.

Enjoy!

v0.0.0-experimental-b1ff171f

This release adds support for data fetching with suspense using React's unstable_useTransition API. It is based on v6.0.0-alpha.5.

Support for suspense is added via a timeoutMs prop that may be passed to a <BrowserRouter>, <HashRouter>, <MemoryRouter>, or <NativeRouter>. Each of these use the prop internally to determine how long to wait to show the new page whenever the URL changes. The default timeoutMs is 5000 (5 seconds).

What does "experimental" mean?

React Router v6's experimental release channel follows the same semantics as React's own experimental channel, which means that it is used for features that are not yet ready for a stable release. Use the experimental releases to try out new features before they are released.

Installing

Development on v6's experimental channel is happening on the dev-experimental branch.

If you'd like to test it out, install from npm:

$ npm install react-router@experimental react-router-dom@experimental

Or, if you're on React Native:

$ yarn add react-router@experimental react-router-native@experimental

We are actively working on documentation. For now, if you're just interested in testing things out you may be interested in the getting started guide. If you're interested in upgrading an existing app, please check out the v5 to v6 migration guide.

Enjoy!

v6.0.0-alpha.5

Major Features

• Added <Route preload> and route.preload (JSX and useRoutes) APIs. The preload function will be called when the route has matched and is about to render.
• Added <NavLink end> and <NavLink caseSensitive> to better control matching behavior of <NavLink>s

Major Changes

Warning: This release breaks compatibility with 6.0.0-alpha.4

• Removed the <Router history> prop and moved responsibility for setting up/tearing down the listener (history.listen) into the wrapper components (<BrowserRouter>, <HashRouter>, etc.). <Router> is now a controlled component that just sets up context for the rest of the app.
• Changed generatePath so it never returns placeholders. Instead, it will throw if a needed placeholder is missing.
• Removed usage of React's experimental useTransition hook. We will publish our own "experimental" channel very soon with this hook added back in, but it won't be added back to the "next" channel (or stable) until it goes stable in React core.

Bugfixes

• Fixed and improved several TypeScript interfaces

Docs

• Added some docs for using the basename functionality to the migration guide

Installing

Development for v6 is happening on the dev branch.

If you'd like to test it out, install from npm:

$ npm install react-router@next react-router-dom@next

Or, if you're on React Native:

$ yarn add react-router@next react-router-native@next

We are actively working on documentation. For now, if you're just interested in testing things out you may be interested in the getting started guide. If you're interested in upgrading an existing app, please check out the v5 to v6 migration guide.

Enjoy!

v5.2.0

This release includes a notable performance boost by separating the "Router" context from the "History" context internally. We also allow every element type for Link's component prop and support a sensitive prop on NavLink for control over case sensitive matching.

Enjoy!

Changes

• Add sensitive prop on NavLink (#7251 by @caseywebdev)
• Fix Link component prop type check (#7276 by @ypyakymiv)
• Update mini-create-react-context (#7288 by @patricksmms)
• Separate history to its own context (#7103 by @illuminist)

v6.0.0-alpha.4

Lots of great stuff in this release, especially if you like Intellisense :)

Major Features

• Migrated the core codebase to TypeScript and added TypeScript declarations
• Added a migration guide for folks coming from reach/router
• Added useInRouterContext hook for determining if you're in the context of a router or not
• Added useLocationPending hook (experimental)
• Added matchPath function for manually matching paths to URL pathnames

Note: experimental features rely on an experimental release of React and will probably be moved into a separate "experimental" release channel in the near future.

Major Changes

Warning: This release breaks compatibility with 6.0.0-alpha.3

• useSearchParams now returns [searchParams, setSearchParams] (similar to useState). setSearchParams is a wrapper for navigate that updates the query string on the current URL. See the updated guide on working with the query string.
• Removed the <StaticRouter context> API. We don't support navigation on the initial render in v6, so this API is unnecessary.
• useMatch takes a route path (instead of a link to value as it did previously). It should have always taken a route path; this was just a simple oversight.

Bugfixes

• Fixed a bug with multiple nested * routes
• Force stable sort in browsers that don't have it so routes that otherwise rank equally maintain the order in which they were originally defined

Installing

Development for v6 is happening on the dev branch.

If you'd like to test it out, install from npm:

$ npm install react-router@next react-router-dom@next

Or, if you're on React Native:

$ yarn add react-router@next react-router-native@next

We are actively working on documentation. For now, if you're just interested in testing things out you may be interested in the getting started guide. If you're interested in upgrading an existing app, please check out the v5 to v6 migration guide.

Enjoy!

v6.0.0-alpha.3

Major Features

• Added a new useSearchParams hook (see f59ee54)

The useSearchParams hook returns a URLSearchParams object created from the current location.search string. This is a feature that people have wanted for a while, but we were always hesitant to ship a full-blown query parser with the router. Well, now that we have URLSearchParams widely available, we don't have to. I wrote up a small guide about how to use useSearchParams if you'd like to read more.

Major Changes

Warning: This release breaks compatibility with 6.0.0-alpha.2

• Redirect (and redirectTo in useRoutes) was removed (see cbcd398)
• We no longer support redirecting on the initial render, due to compatibility issues with future versions of React

React won't let us change the state in an ancestor component on the initial render w/out warning, so we had to remove the <Redirect> component, as well as the ability to do a navigate() on the initial render. You can still render a <Navigate>, but it won't actually update the page until the next render.

If you really need to redirect on the initial render, you can either a) do it on your server (probably best, so it can be cached at the HTTP level instead of doing it in every user's browser) or b) do it outside of React Router (e.g. using the history API directly).

Installing

Development for v6 is happening on the dev branch.

If you'd like to test it out, install from npm:

$ npm install react-router@next react-router-dom@next

Or, if you're on React Native:

$ yarn add react-router@next react-router-native@next

We are actively working on documentation. For now, if you're just interested in testing things out you may be interested in the getting started guide. If you're interested in upgrading an existing app, please check out the v5 to v6 migration guide.

Enjoy!

v3.2.6

Changes

• Upgrade hoist-non-react-statics/react-is to support newer React APIs (#7182 by @henryqdineen)

v6.0.0-alpha.2

This release fixes a few bugs with the previous alpha, namely:

• Fix a few path matching corner cases
• Fix rendering <Link>s on the server (see #7126, thanks @danpantry)

Also, we added a new doc about adding React Router to your web project whether you're using create-react-app, Webpack, Parcel, or just plain 'ol <script> tags. Thanks @chancestrickland!

Development for v6 is happening on the dev branch.

If you'd like to test it out, install from npm:

$ npm install react-router@next react-router-dom@next

Or, if you're on React Native:

$ yarn add react-router@next react-router-native@next

We are actively working on documentation. For now, if you're just interested in testing things out you may be interested in the getting started guide. If you're interested in upgrading an existing app, please check out the v5 to v6 migration guide.

Enjoy!

v6.0.0-alpha.1

Moved history from peerDependencies to dependencies. This should make it easier for people to install and test.

If you'd like to test it out, install from npm:

$ npm install react-router@next react-router-dom@next

Or, if you're on React Native:

$ yarn add react-router@next react-router-native@next

v6.0.0-alpha.0

First alpha release of the next major version of React Router, version 6. A few of the highlights are:

• Relative routes and links
• Nested <Route>s
• Automatic<Route> ranking with a new <Routes> API
• New suspense-ready navigate API
• useRoutes + matchRoutes for using object-based routing API

Development for v6 is happening on the dev branch.

If you'd like to test it out, install from npm:

$ npm install history@5 react-router@6 react-router-dom@6

Or, if you're on React Native:

$ yarn add history@5 react-router@6 react-router-native@6

We are actively working on documentation. For now, if you're just interested in testing things out you may be interested in the getting started guide. If you're interested in upgrading an existing app, please check out the v5 to v6 migration guide.

Please note that although there are several breaking changes we are still working on the migration path and will continue to publish improvements and helpers in v5 that should help you upgrade as smoothly as possible. We are not done with v5. Heck, we're still cutting releases of v3.

This release addresses several long-standing issues and pitfalls with previous releases. We are focused on providing a smooth upgrade path for both v4/5 users and v3 users who would like to make the jump to v6. We will be publishing more very soon.

Enjoy!