I have a Svelte 3 SPA that sits in front of a Django API. Currently, it compiles the prod release into the static folder used by Django. The SPA is served by a Django template to let it take care of auth. Svelte is configured to use consistent names for the compiled artefacts:
The Django template to show the svelte app is basically an empty page that links in the SPA:
<link rel='stylesheet' href={% static 'svelte/build/bundle.css' %}>
<link rel='stylesheet' href={% static 'svelte/build/vendor.css' %}>
<script defer src={% static 'svelte/build/bundle.js' %}></script>
Django is setup to handle a couple of URL paths and then pass anything else through to the svelte template. Because it's a Django template, if the user hasn't auth'd when viewing it it takes them through the login process first, then back to the app.
This has been working great and has been easy to deploy & explain to others.
I'm currently migrating to SvelteKit 2 before a handover (mostly due to the prominence of SK docs over vanilla svelte). I'm following the now recommended approach for SPAs and using adapter-static to produce the build artefacts. With the way the app currently authenticates, I can't fall through at the web server level. The html adapter-static produces for the fallback uses dynamic artefact names so I can't easily replicate the current approach:
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<link rel="icon" href="/favicon.png" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link rel="modulepreload" href="/_app/immutable/entry/start.MLInDddK.js">
<link rel="modulepreload" href="/_app/immutable/chunks/scheduler.k-kUyWhY.js">
<link rel="modulepreload" href="/_app/immutable/chunks/singletons.MhcTvhTo.js">
<link rel="modulepreload" href="/_app/immutable/entry/app.Ax4QikuD.js">
<link rel="modulepreload" href="/_app/immutable/chunks/index.5XCitCbI.js">
</head>
<body data-sveltekit-preload-data="hover">
<div style="display: contents">
<script>
{
__sveltekit_1758etu = {
base: "",
env: null
};
const element = document.currentScript.parentElement;
Promise.all([
import("/_app/immutable/entry/start.MLInDddK.js"),
import("/_app/immutable/entry/app.Ax4QikuD.js")
]).then(([kit, app]) => {
kit.start(app, element);
});
}
</script>
</div>
</body>
</html>
Is there a way to have SvelteKit/adapter-static produce non-dynamic names when compiled?