Adaption of the standard static adapter from the Sveltekit team. Inspiration for this custom adapter is based on the input in issue #3166 provided by Adam Coster. The goal of the adapter is to allow custom logic to be run at specific hooks inside the build process of the static adapter.
Install package with npm i -D @ivorgri/sveltekit-pluggable-static-adapter
, then add the adapter to your svelte.config.js
:
// svelte.config.js
import adapter from '@ivorgri/sveltekit-pluggable-static-adapter';
There are three possible hooks:
These hooks should be provided with functions that should be run in order by the callback hooks. This should be done in the svelte.config.js file.
In these hooks, the following information from the static adapter is available:
// svelte.config.js
export default {
kit: {
adapter: adapter({
// default options provided by regular static adapter
pages: 'build',
assets: 'build',
fallback: null,
precompress: false,
afterCleanupCallback: async (builder, pages, assets) => {
// Add functions here
},
afterPrerenderCallback: async (builder, pages, assets) => {
// Add functions here
},
afterPrecompressCallback: async (builder, pages, assets) => {
// Add functions here
},
})
}
};
You can make your own plugin by creating an async function, which does something with the build files (or before they are build). For some examples, see the list of plugins below.
Below you can find a list of plugins that are already out there.
// svelte.config.js
// ...
import convertAssetsToWebp from '@ivorgri/sveltekit-pluggable-static-adapter-webp-plugin';
//...
export default {
kit: {
adapter: adapter({
// ...
afterPrerenderCallback: async (builder, pages, assets) => {
await convertAssetsToWebp(builder,assets);
},
})
}
};
// svelte.config.js
// ...
import replaceExternalImages from '@ivorgri/sveltekit-pluggable-static-adapter-external-image-plugin';
//...
export default {
kit: {
adapter: adapter({
// ...
afterPrerenderCallback: async (builder, pages, assets) => {
await replaceExternalImages("origin.domain.of.images.com",builder,pages,assets)
},
})
}
};
// svelte.config.js
// ...
import generateSitemap from '@ivorgri/sveltekit-pluggable-static-adapter-sitemap-plugin';
//...
export default {
kit: {
adapter: adapter({
// ...
afterPrerenderCallback: async (builder, pages, assets) => {
await generateSitemap("your.site.domain.com",builder,pages)
},
})
}
};
The Changelog for this package is available on GitHub.