chore: add client side svelte example

examples/with-react/src/env.d.ts

@@ -1,6 +1,2 @@
 /// <reference types="svelte" />
 /// <reference types="vite/client" />
-/// <reference types="stack54/client" />
-
-/// <reference path="../.stack54/env.d.ts" />
-/// <reference path="../.stack54/views.d.ts" />

examples/with-svelte/bin/server.js

@@ -0,0 +1,26 @@
+// @ts-check
+
+import express, {static as static_} from "express";
+import router from "../dist/server/index.js";
+
+const app = express();
+
+const serve_build_assets = static_("./dist", {
+  immutable: true,
+  maxAge: "1y",
+});
+
+// http://expressjs.com/en/advanced/best-practice-security.html#at-a-minimum-disable-x-powered-by-header
+app.disable("x-powered-by");
+
+app.use(serve_build_assets);
+
+app.use(static_("static", { maxAge: "1h" }));
+
+app.use(router);
+
+const port = process.env.PORT || 3000;
+
+app.listen(port, () => {
+  console.log(`✅ app ready: http://localhost:${port}`);
+});

examples/with-svelte/package.json

@@ -5,21 +5,22 @@
   "type": "module",
   "private": true,
   "scripts": {
-    "dev": "vite dev",
-    "build": "vite build",
-    "preview": "vite preview"
+    "dev": "stack54 dev",
+    "build": "stack54 build",
+    "start": "node ./bin/server.js"
   },
   "keywords": [],
   "dependencies": {
-    "@hono/node-server": "^1.4.0",
-    "hono": "^3.12.0",
-    "stack54": "^0.1.0",
+    "@stack54/express": "^0.0.2",
+    "express": "^4.19.2",
+    "stack54": "^0.5.2",
     "svelte": "^4.2.8"
   },
   "devDependencies": {
     "@sveltejs/vite-plugin-svelte": "^3.0.1",
     "@tsconfig/svelte": "^5.0.2",
+    "@types/express": "^4.17.21",
     "typescript": "^5.3.3",
-    "vite": "^5.0.10"
+    "vite": "^5.4.1"
   }
 }

examples/with-svelte/src/entry.ts

@@ -1,12 +1,12 @@
-import { Hono } from "hono";
-import { view } from "stack54/view";
+import express from "express";
+import { register } from "@stack54/express/render";
 
 import { render } from "./utils/view";
 
-const app = new Hono();
+const app = express();
 
-app.use(view(render));
+register(app, render);
 
-app.get("/", (ctx) => ctx.render("welcome", {}));
+app.get("/", (_, res) => res.render("welcome", {}));
 
 export default app;

examples/with-svelte/src/env.d.ts

@@ -1,6 +1,2 @@
 /// <reference types="svelte" />
 /// <reference types="vite/client" />
-/// <reference types="stack54/client" />
-
-/// <reference path="../.stack54/env.d.ts" />
-/// <reference path="../.stack54/views.d.ts" />

examples/with-svelte/src/utils/view.ts

@@ -2,7 +2,6 @@ import { makeFactory, resolveComponent } from "stack54/render";
 import { type TemplateModule } from "stack54/types";
 
 const components = import.meta.glob<TemplateModule>("../views/**/*.svelte", {
-  query: { ssr: true },
   eager: true,
 });
 

examples/with-svelte/stack.config.js

@@ -0,0 +1,6 @@
+import { defineConfig } from "stack54/config";
+import express from "@stack54/express/plugin";
+
+export default defineConfig({
+  integrations: [express()],
+});

examples/with-svelte/tsconfig.json

@@ -1,4 +1,4 @@
 {
   "extends": "stack54/tsconfigs/base",
-  "include": ["src", "vite.config.ts"]
+  "include": ["src"]
 }