mossberg.dev

Prerendering using $page.url becomes http://sveltekit-prerender in SvelteKit

If you are running a SvelteKit website and you prerender routes, anywhere that you use $page.url will show up as http://sveltekit-prerender.

One scenario is if you are doing some meta tags.

<svelte:head>
    <meta property="og:url" content="{$page.url}">
</svelte:head>

This would render as

<meta property="og:url" content="http://sveltekit-prerender">

The fix for this is to set the kit.prerender.origin in svelte.config.js.

kit: {
    prerender:{
        origin: 'https://mossberg.dev',
    }
}

Now, the above code will render as:

<meta property="og:url" content="http://mossberg.dev">

This is an important setting if you are using the library sk-seo.

Check the prerender configuration documentation for more information.

Fabian Mossberg

2024-10-01

My name is Fabian and I'm a developer from Sweden. I prefer to work in Svelte, and this blog is my playground for anything dev-related.