question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Routing broken for preview with react-router-dom in 4.0.0-alpha.2

See original GitHub issue

Describe the bug

When going to /some/route/somewhere using react-router-dom with preview the query path is not passed to the route leading to a 404 error. In local dev it works fine.

git bisect indicates this PR is the cause: https://github.com/vitejs/vite/pull/10475

Reproduction

https://stackblitz.com/edit/vitejs-vite-f9vj36?file=package.json,src%2FApp.jsx,vite.config.js&terminal=build,preview

Steps to reproduce

note: the StackBlitz link will run a build then run preview from the terminal query param. In dev the problem does not appear to happen.

Go to /test/about in the StackBlitz repro: image

System Info

n/a

Used Package Manager

yarn

Logs

No response

Validations

Issue Analytics

  • State:closed
  • Created 10 months ago
  • Reactions:9
  • Comments:6 (2 by maintainers)

github_iconTop GitHub Comments

4reactions
micktgcommented, Dec 10, 2022

I can confirm this error in vite 4.0.0 (stable) as well. In dev everything works fine, but as soon as I run yarn preview refreshing a nested route it breaks, e.g. http://localhost:3000/user but navigating from http://localhost:3000/ to http://localhost:3000/user via link works fine

1reaction
micktgcommented, Dec 12, 2022

I just installed v4.0.1 and my problem has been solved. Awesome job guys and thank you!

I can confirm this error in vite 4.0.0 (stable) as well. In dev everything works fine, but as soon as I run yarn preview refreshing a nested route it breaks, e.g. http://localhost:3000/user but navigating from http://localhost:3000/ to http://localhost:3000/user via link works fine

Read more comments on GitHub >

github_iconTop Results From Across the Web

Routing broken for preview with react-router-dom in 4.0.0 ...
Describe the bug When going to /some/route/somewhere using react-router-dom with preview the query path is not passed to the route leading to a...
Read more >
Nested routing is not working in React Router dom V4 from ...
I am trying to implement nested routing in my React app, but 'Route' only works when used in App.js and doesnot works when...
Read more >
React Router v6 Preview
react-router-dom @6.0.0-alpha.2 reveals the total bundle size decreased by 70%. Smaller bundles means your app loads more quickly, especially ...
Read more >
React Router v6 Preview: Nested Routing (TUTORIAL)
View the code on GitHub: https://github.com/samselikoff/2020-06-09-react- router -v6-navlink.
Read more >
Getting started with React Router v4 - Pusher Blog
You can open http://localhost:3000 to preview it in the browser. Next, we need to install React Router. In version 4, the library was...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found