Svelte app. Using svelte-routing. Click on a route, displays fine. Click refresh - broken link. Fix?

Deployed svelte site no problem. Runs no problem until I try to “refresh” then I get broken link. Im using netlify.toml file and added

[[redirects]]
from = "/*"
to = "/index.html"
status = 200

When I deploy live the refreshes work fine but when I ntl dev (locally), I now get a blank page instead of my site home page.
So I tried the _redirect file in the public folder with /* /index.html 200 and it did the same. Then I tried /* /app.svelte 200 and now locally the site is displaying fine but online refreshes bomb again.
Whats the missing link?

A site name or ID can help us debug this.

[https://astonishing-chimera-958017.netlify.app]

I also tried /* /main.js 200 in _redirects and that runs fine locally but bombs on refreshes once deployed. Your documents say create _redirects in the publish folder but if you create it there (dist ) then it gets removed when you run npm run build. So I create it in public and then when npm build runs, it gets copied to dist.

My netlify.toml file in case this is of use is :
[build]
publish=“dist”
[dev]
command = “npm run dev”
targetPort=5173
port=8888
[functions]
node_bundler=“esbuild”

Thanks for any assistance.

I don’t see any redirects being deployed with your site:

Where are you saving the netlify.toml or the _redirects file?

I tried both. Started with adding [[redirects]] to netlify.toml but as that wasnt working, trying _redirects.

Yes I checked that same link you just sent and the document says create the _redirects in the publish folder, which for svelte/vite is dist. But if you create it there and then run npm run build, it recreates the dist folder without the _redirects file, or it did when I just tried it. ( Redirects and rewrites | Netlify Docs)

Based on: sveltekit - Where to put images with Svelte Kit - Stack Overflow, the folder to add static files in SvelteKit is static and not public. So you can try adding the _redirects file in the static folder.

In any case, netlify.toml should work as long as it’s in the root directory.

I will try netlify.toml again, as mentioned first in this request but it did not work locally and it is in the root of the application folder. It DID work when deployed - the refreshes worked, but locally it gave me a blank page! I will try again.

Im using Svelte not Sveltekit but I can give that a try. Svelte doesnt have a static folder by default.

===

ok, I removed the _redirects file. I updated the netlify.toml file in my root directory to:
[build]
publish=“dist”
[dev]
command = “npm run dev”
targetPort=5173
port=8888
[functions]
node_bundler=“esbuild”
[[redirects]]
from = “/*”
to = “/index.html”
status = 200

I run npm run build.
I run ntl dev - I get a blank screen. Inspect/Console shows:
client:1

   Failed to load module script: Expected a JavaScript module script but the server responded with a MIME type of "". Strict MIME type checking is enforced for module scripts per HTML spec.

I run ntl deploy live and the site displays fine and I can go to any route and refresh and it displays fine also. So live works while local broken or local works while live broken!

The site still shows on Netlify as “no redirect rules processes” even though obviously something did process as the refreshes work. So I am back where I started.

Any other suggestions?

Any other suggestions?

I’m only seeing this as your netlify.toml:

[build]
publish="dist"
[dev]
command = "npm run dev"
targetPort=5173
port=8888
[functions]
node_bundler="esbuild"

Are you sure you’ve added the redirect? Could you share the repo?

Hi hrishikesh. Any further thoughts on the redirects on refresh not working on Netlify, using svelte with svelte-routing - works fine locally under ntl dev but not when deployed. I could not, as mentioned, get either [[redirects]] in netlify.toml to work or _redirects file in public folder. Again this is Svelte, not Sveltekit.

Hi @kreollc,

To help us best debug the issue, would it be possible to share the repo? Or if you can’t share the current repo, if you could create a minimal reproduction that has the same issue and share that repo. Thanks!

Thanks. I could provide a repo of the entire site but am reluctant to do so. I will see if time permits to create the requested smaller version that reproduces the issue.