ReactJS – React-Router does not match query strings

devServer: {
 historyApiFallback: true ;
}

My route is defined as follows:

When I visit/experiment, Things work as expected, and the experimental components are presented. However, when I manually enter the URL with query parameters, for example: /experiments? offset = 50, the route does not match!

But when I navigate using , things work as expected. The Experiments component is rendered and this. props.location.query.offset is set to 50.

When manually (or copy and paste) the URL with the query string, how to make the path match?

It seems that the route should automatically match url-with-query-‌​string-not-matching-‌​react-router-route, but it doesn’t seem to work for me.

Edit:
I narrowed the problem down to the almighty route path=”*”. When I delete this route, everything works fine (for example, when I visit/experiment? Offset=50). But when the catch-all Route exists When there is no route match, even if it is at the bottom of the priority list.

You need to use historyApiFallback and history=(browserHistory) to load the route when you manually enter the route.

The role of historyApiFallback is to make your server return index.html to find any URL you try to access, because your route is subsequently configured for index.html, so you can directly access any Route URL

Add to your webpack

devServer: {
 historyApiFallback: true;
}

p>