Lovable Pages Return 404 on Direct URL
Quick Answer
How do I fix Lovable Pages Return 404 on Direct URL?
The hosting platform tries to find a static file for each route. Client-side routing needs all requests to route through index.html or the Next.js handler. Start with "Add Vercel routing config" before making broader code changes.
Fix signals
- What this answers
- Why lovable pages return 404 on direct url happens and what to change first.
- Fastest move
- Add Vercel routing config
- Use this page if
- Home page works
If this keeps happening
Open the next decision, not just the patch
Use these when the current fix is helpful, but the real answer is a better tool choice, a cleaner workflow layer, or a more trustworthy launch path.
Lovable reviews
Open this when the same full-stack MVP failures keep repeating and you need a harder answer on whether Lovable is still the right bet.
Open this next →
Cursor review
Open this when the pattern behind the bug is really about generated speed versus owning more of the stack in code.
Open this next →
Deploy hub
Open this when the fix is exposing a bigger production handoff problem, not just one broken feature.
Open this next →
Tool picker
Open this when the repeated bug is making you question the whole stack choice instead of the latest patch.
Open this next →
Firecrawl review
Open this when the app also needs live web data and the next stack decision is no longer only about the builder itself.
Open this next →
Quick Fix Summary
| Most likely cause | The hosting platform tries to find a static file for each route. Client-side routing needs all requests to route through index.html or the Next.js handler. |
| Fastest fix | Add Vercel routing config |
| Use this page if | Home page works |
You're in the right place if...
- !Home page works
- !Navigating to /about returns 404
- !Refreshing any page except home shows 404
Why this happens
The hosting platform tries to find a static file for each route. Client-side routing needs all requests to route through index.html or the Next.js handler.
Fix
Add Vercel routing config
If using Vercel, add a vercel.json to your project root:
{
"rewrites": [
{ "source": "/(.*)", "destination": "/" }
]
}Or tell Lovable to fix it
If you're not sure about the config:
Copy this prompt
Direct URL navigation returns 404 on all pages except home. Please fix routing so all pages work when accessed directly or on page refresh.
Prevent this next time
Test direct URL access (type a page URL directly in the browser) before sharing your site. This catches routing issues early.
Frequently Asked Questions
In-app navigation uses client-side routing (no server request). Direct URLs hit the server, which needs to know to serve your app for all routes.
Yes. If Google can't access your pages directly, they won't be indexed. Fix this before submitting to Search Console.
Related fixes
Lovable App Shows a Blank Screen After Deploy
Lovable Vercel Build Failed
Vercel Shows a Red X and the Deploy Never Goes Live
Lovable App Takes 3-5 Seconds to Load
Why Does Lovable Keep Changing Things I Didn't Ask For?
Lovable Form Submits but Supabase Saves Nothing