Multiple +page.html?

[nbbaier]

Great work here! Really interested to see where this project goes. Is it possible to have multiple routes specified in src/client? Something like:

src/
└── client
    ├── bar
    │   └── +page.html
    └── foo
        └── +page.html

With those paths mapping to routes: example.com/foo / example.com/bar? How would one handle this?

[rossrobino]

Thanks for your interest in the project! Yes, any +page.html within src/client/ is included as an entry point automatically. All requests are run through the handler, so to make these pages available as routes, you can import them and serve them at the path you want to.

Here's an example if you are using vanilla JS.

// src/server/+func.ts
import { html as bar } from "client:page/bar"; // transformed src/client/bar/+page.html
import { html as foo } from "client:page/foo"; // transformed src/client/foo/+page.html
import type { Handler, Prerender } from "domco";

export const handler: Handler = (req) => {
    const { pathname } = new URL(req.url); // get the pathname from the request

    // serve the html based on the pathname
    if (pathname === "/bar") {
        return new Response(bar, { headers: { "Content-Type": "text/html" } });
    } else if (pathname === "/foo") {
        return new Response(foo, { headers: { "Content-Type": "text/html" } });
    }

    return new Response("Not found", { status: 404 });
};

// if you want to prerender the routes to static pages:
export const prerender: Prerender = ["/bar", "/foo"];

Let me know if that answers your question and suits your needs.

[rossrobino]

Added the example to the docs as well

[nbbaier]

Thanks! This is definitely the bit that I wasn't really able to figure out:

import { html as bar } from "client:page/bar"; // transformed src/client/bar/+page.html
import { html as foo } from "client:page/foo"; // transformed src/client/foo/+page.html

[rossrobino]

Appreciate it! I'll keep working on the docs.