https://github.com/gauben/modularized-sveltekit-app
Prototype for modular SvelteKit apps
https://github.com/gauben/modularized-sveltekit-app
Last synced: about 1 month ago
JSON representation
Prototype for modular SvelteKit apps
- Host: GitHub
- URL: https://github.com/gauben/modularized-sveltekit-app
- Owner: GauBen
- Created: 2022-01-16T11:12:35.000Z (over 3 years ago)
- Default Branch: main
- Last Pushed: 2022-01-16T11:13:15.000Z (over 3 years ago)
- Last Synced: 2025-04-12T20:18:35.583Z (about 1 month ago)
- Language: JavaScript
- Homepage: https://github.com/sveltejs/kit/issues/3369
- Size: 15.6 KB
- Stars: 4
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# modularized-sveltekit-app
## Dependency graph
[](https://mermaid-js.github.io/mermaid-live-editor/edit#eyJjb2RlIjoiZmxvd2NoYXJ0IFREXG4gICAgbWVzc2FnZXMgLS0-IGFwcCBcbiAgICB1c2VycyAtLT4gYXBwXG4gICAgdXNlcnMgLS0-IG1lc3NhZ2VzXG4iLCJtZXJtYWlkIjoie1xuICBcInRoZW1lXCI6IFwiZGVmYXVsdFwiXG59IiwidXBkYXRlRWRpdG9yIjpmYWxzZSwiYXV0b1N5bmMiOnRydWUsInVwZGF0ZURpYWdyYW0iOmZhbHNlfQ)
This app is made of 3 sub-apps:
- **users**, a module that offers a Svelte component `UserList.svelte` and an API `/api/users.json`
- **messages**, a module that offers a Svelte component `Chat.svelte` and an API `/api/messages.json` ; it depends on users' library
- **app**, the main SvelteKit app, that offers an entrypoint `/` and uses the two other modules
## How does it work?
- Dependencies are managed by pnpm with the [Workspace](https://pnpm.io/workspaces) feature
- All modules are built with [adapter-node](https://github.com/sveltejs/kit/tree/master/packages/adapter-node) (with [#3362](https://github.com/sveltejs/kit/pull/3362) merged)
- They are loaded dynamically as vite middlewares
```js
vite: {
plugins: [loadModules('@gauben/users', '@gauben/messages')],
},
```
## How to try it?
You'll need to clone [gauben/kit](https://github.com/GauBen/kit):
```bash
git clone https://github.com/GauBen/kit
cd kit
pnpm install
pnpm build
cd ..
```
You'll also need to clone this very repo:
```bash
git clone https://github.com/GauBen/modularized-sveltekit-app
cd modularized-sveltekit-app
pnpm install
# Link gauben/kit
cd app && pnpm link ../kit/packages/adapter-node && cd ..
cd messages && pnpm link ../kit/packages/adapter-node && cd ..
cd users && pnpm link ../kit/packages/adapter-node && cd ..
pnpm dev
# ✨
```
**Even server-side rendering works!**
## Currently broken
- Type declarations