Skip to content

Hacky solution to build SvelteKit project in a looking-like-one bundle.js

Notifications You must be signed in to change notification settings

d-velopment/SvelteKit-One-Bundle

Repository files navigation

SvelteKit-One-Bundle

As SvelteKit Static Adapter doesn't provide any solution to have a single bundle.js file to be loaded/called to start rendering the application, this "hacky" solution has been developed to explode and re-wrap the project into an initial bundle (to be used itself as a module of an external application) and a custom index.html to load the bundle from. The final build is located @ dist folder.

Development preview

npm run dev
-> open https://localhost:5005/

Wrapped build preview

npm run build
cd dist
python -m http.server --cgi 8082
-> open http://localhost:8082/

* python command presumes you have Python preinstalled on your machine, or using macOS.

Main differences

  • In svelte.config.js a static adapter's fallback is configured to temporary bundle.html fallback would be converted to bundle.js:
kit: {
	adapter: adapter({
		...
		fallback: "bundle.html",
		...
	})
  • Pre-composed src/static/index.page would become an index.html after the build, contains of .overlay element where the running application would be rendered:
...
    <div class="overlay"></div>
    <script type="module" src="./bundle.js"></script>
...

About

Hacky solution to build SvelteKit project in a looking-like-one bundle.js

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published