Pass external flags to adapter-static

[oliversturm]

I have a build setup where my Svelte Kit app is built for two deployment scenarios: a GitHub pages site that is used as a staging area for development versions, and a site that has the publicly released app version. "Development version" means, in this case, that it contains features which are in development - not that it's technically a dev build. Both builds use adapter-static.

I can now build both versions by using something like this in svelte.config.js:

const dev = process.env.NODE_ENV === 'development';
const githubStaging = process.env.GITHUB_STAGING === 'staging';

const config = {
	kit: {
		...
		adapter: staticAdapter(),
		paths: {
			base: dev ? '' : githubStaging ? '/gh-pages-prefix' : '/public-site-prefix',
		},
	},
...

In package.json I have these:

		"build-github": "GITHUB_STAGING=staging svelte-kit build",
		"build": "svelte-kit build",

This works fine. However, now I want to show a banner on the GitHub Pages site, to make it obvious to anybody that the version of the app available there is not the bug-free (ha!) public one. So I need some way of passing a flag (for instance the value of GITHUB_STAGING, or at least based on it?) through to the Svelte component, to conditionally render the banner depending on the build scenario.

Ideas? I have looked, but I haven't found any feature in the config of Svelte Kit or adapter-static that would enable this. Maybe I'm missing something?

Update - as a workaround I now decided to have this:

		files: {
			template: githubStaging ? 'src/app.staging.html' : 'src/app.html',
		},

This does the trick for my purpose, more or less, because I can display the banner I want from the template file.

Other than that, the only idea I had was to look at paths.base and distinguish from there which build I'm in - less than elegant. So I'm still interested to hear if there are any better solutions.