Search code examples
sveltekitsveltekit-adapter-static

How can I change the output path of my page in sveltekit when using adapter-static?


In my Sveltekit app I have some page at src/routes/blog/content/first/+page.svelte. I'm using adapter-static to create a static build. I have set prerender = true in +layout.js

I do not want to change the file path in my svelte code. I want users to be able to visit /blog/first and get the content that was present in /blog/content/first. Basically, I want to ignore "/content" in my folder structure when routing.

I tried using the reroute hook

In src/hooks.js I put

export function reroute({ url }) {
    if (url.pathname.match(/blog\/.+/) && !url.pathname.match(/blog\/content\/.+/)) {
        return url.pathname.replace('/blog', '/blog/content');
    }
    return url.pathname;
}

This works in dev server. But after building there is no change in the behaviour of the website. It is available at /blog/content/first but not at /blog/first. It's as if the reroute hook doesn't run at all in my prerendered build.

Even if I put console.log("test") in the reroute function, it doesn't print it in the build (it does in dev server). I believe I'm misunderstanding how reroute works.

How can I change the path of the output files without changing my file structure.


Solution

  • You can remove the directory from routing by parenthesizing it:

    src/routes/blog/(content)/first/+page.svelte
    

    Docs on "groups"