{"id":18925569,"url":"https://github.com/nightmachinery/multiseed","last_synced_at":"2025-09-12T22:42:24.826Z","repository":{"id":37968080,"uuid":"502923147","full_name":"NightMachinery/multiseed","owner":"NightMachinery","description":"My multi-page svelte playground.","archived":false,"fork":false,"pushed_at":"2023-12-15T05:09:06.000Z","size":48,"stargazers_count":0,"open_issues_count":1,"forks_count":0,"subscribers_count":2,"default_branch":"master","last_synced_at":"2024-12-31T17:48:05.119Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/NightMachinery.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2022-06-13T11:15:25.000Z","updated_at":"2022-06-13T11:15:39.000Z","dependencies_parsed_at":"2024-11-08T11:12:27.870Z","dependency_job_id":"b70eac25-3402-4496-b96a-4b82916ce2fd","html_url":"https://github.com/NightMachinery/multiseed","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/NightMachinery%2Fmultiseed","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/NightMachinery%2Fmultiseed/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/NightMachinery%2Fmultiseed/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/NightMachinery%2Fmultiseed/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/NightMachinery","download_url":"https://codeload.github.com/NightMachinery/multiseed/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":239921844,"owners_count":19718844,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-11-08T11:12:21.936Z","updated_at":"2025-02-20T22:16:31.610Z","avatar_url":"https://github.com/NightMachinery.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Multipage Svelte, Svelte MPA\n\nThe purpose of this project is to make Svelte that defaults is component-based SPA into an statically-generated MPA (multipage SPA, page+component-based). \nSo for deployment you only need to [rsync](//rsync.samba.org/) the `.html`, `.css`, `.js` and any other non-`.svelte` files. \nIt was originally built for [Z](https://github.com/kokizzu/gotro/tree/master/Z) template engine.\n\nCreator: [sameerveda](//github.com/sameerveda)\n\nSpecs/sponsored by: [kokizzu](//github.com/kokizzu)\n\n## Specification\n\nFor example you have a project with specific structure:\n\n```shell\n_mycomponent/\n  button.svelte\nfoo/\n  _table.svelte\n  bar.svelte --\u003e will generate bar.html\n  any.js\nsubpage/\n  page3.svelte --\u003e will generate page3.html\nindex.svelte --\u003e will generate index.html\nwhatever.css\nwhatever.js\n_layout.html\n```\n\nIt would automatically generate 3 files: `foo/bar.html`, `subpage/page3.html`, and `index.html`.\n\n1. generate automatically `.html` foreach `.svelte`, for production build use `npm run build:prod`\n2. there no configuration, it should work as-is automatically, anything starts with underscore will not generate `.html`, eg. `_component1.svelte`, or `_components/table.svelte`\n3. will look for `_layout.html` in current directory or nearest upper directories as base template\n4. can import properly other js, css, or svelte file (relative import)\n5. dev mode, eg. `npm start`, it would listen to `localhost:5500` then livereload when changed like default svelte template project (will also autogenerate the `.html` files like spec number 1)\n6. using minimal set of npm dependencies and no outdated package\n7. generated html will not remove comments, especially one that used in [Z](https://github.com/kokizzu/gotro/tree/master/Z) template engine, like: `/*! c1 */`, `#{c2}`, `[/* c3 */]`, or `{/* c4 */}`\n\n## Usage\n\n```shell\nnpm install -g degit                 # scaffolding helper\ndegit kokizzu/svelte-mpa myproject1  # clone this repo with new name\ncd myproject1                        \n\nnpm install    # install dependencies\nnpm start      # start dev-server, auto rebuild\nnpm run watch  # auto rebuild without webserver, \n               # eg. if you use other webserver/reverse proxy locally\n\nnpm run build:prod  # build project for production\n./deploy.sh         # example deployment script for single server\n```\n\n## Dev Dependencies\n\n- [svelte](//svelte.dev/) - cybernetically enhanced web apps\n- [esbuild](//esbuild.github.io/) - an extremely fast JavaScript bundler\n- [esbuild-svelte](//github.com/EMH333/esbuild-svelte) - plugin to compile svelte components for bundling with esbuild\n- [chokidar](//github.com/paulmillr/chokidar) - minimal and efficient cross-platform file watching library\n- [five-server](//github.com/yandeu/five-server) - development Server with Live Reload Capability\n- [lodash](//lodash.com) - A modern JavaScript utility library delivering modularity, performance \u0026 extras\n- [parse5](//github.com/inikulin/parse5) - html parsing/serialization toolset for node.js\n- [svelte-preprocess](//github.com/sveltejs/svelte-preprocess) - a svelte preprocessor with sensible defaults and support for: postcss, scss, less, stylus, coffeescript, typescript, pug and much more.\n\nzero production dependency.\n\n## Why? Motivation\n\nIf you already have existing backend that wasn't written in NodeJS, you can have best of two worlds, multiple page with their own meta headers and content for SEO, and reactivity using Svelte for each page. Also with this you can remove the serialization/transport/hop-cost of default setup:\n\n```\n[Browser] --fetch-HTML--\u003e [SvelteKit/Next/Nuxt/etc] --fetch-API--\u003e [ExistingBackend]\n\nbecame\n\n[Browser] --fetch-HTML/API--\u003e [ExistingBackend]\n```\n\nSo your existing backend responsibility is to load the generated `.html` then replace the js variable or any template keyword with proper value for initial load/SEO. So not svelte's responsibility to request/preload the initial json content, but backend's responsibility (whatever existing backend langauge/framework you are using). Like SvelteKit, you can also use this as SSG. You can see example [here](//github.com/kokizzu/sveltefiber)\n\n## TODO / Possible Improvement\n\n- [ ] update `\u003c!--BUILD TIME` generated comment from highest modification date of dependencies, eg. if `a.svelte` depends on `b.js` and `_c.svelte`, the resulting `a.html` html comment should be max modification date of those three \n- [ ] generate bundled javascript `[name].min.js` foreach `[name].svelte` file that will imported by generated `[name].html`, to reduce overhead when page's bundled reactivity code size is very big, only when svelte file doesn't contain Z-template special keywords, so the code might look like this:\n```html\n`_layout.html`:\n...\n\u003cscript\u003e\n  let obj = {/* some_obj */}\n  let arr = [/* some_arr */]\n\u003c/script\u003e\n\n`bla.svelte`:\n\u003cscript\u003e\n  let obj = (window||{}).obj || {};\n  let arr = (window||{}).arr || [];\n\u003c/script\u003e\n\ngenerated `bla.min.js` will be referenced by `bla.html`: \n\u003cscript src='bla.min.js?generatedTime'\u003e\u003c/script\u003e\n```\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fnightmachinery%2Fmultiseed","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fnightmachinery%2Fmultiseed","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fnightmachinery%2Fmultiseed/lists"}