Baseurl

Base element

Standard HTML has a base element that is prepended to all relative URLs and can be used to serve your site from a subfolder (e.g. mysite.com/my-subfolder/), which is common on platforms like GitLab Pages

Implementation

In your sitewide plenti.json configuration file, you can specify a baseurl like this: {
  "baseurl": "/my-subfolder/"
}
 
This information gets added to a magic variable called env, along with a boolean called local which lets you serve the site like normal when you're developing it and still use a baseurl on the deployed version. In order to do that, in your <head> element, do something like this: <script>
  export let env;
</script>

<head>
  <base href="{ env.local ? '/' : env.baseurl }">
</head>
 
(Note: make sure to first pass env from the parent component, likely layouts/global/html.svelte

Usage

Now that your site is configured to use baseurls, you need to make sure you're actually using relative links (about), not root relative links (/about) or absolute links (mysite/about). You'll also want to update all links back to your homepage to use a dot . instead of a forward slash / in order to work with the base element correctly when deployed.