@solidjs/start 2.0.0-beta.1 → 2.0.0-beta.10

package/dist/config/fs-router.js

@@ -0,0 +1,148 @@
+import { analyzeModule, BaseFileSystemRouter, cleanPath, } from "./fs-routes/router.js";
+export class SolidStartClientFileRouter extends BaseFileSystemRouter {
+    toPath(src) {
+        const routePath = cleanPath(src, this.config)
+            // remove the initial slash
+            .slice(1)
+            .replace(/index$/, "")
+            .replace(/\[([^/]+)\]/g, (_, m) => {
+            if (m.length > 3 && m.startsWith("...")) {
+                return `*${m.slice(3)}`;
+            }
+            if (m.length > 2 && m.startsWith("[") && m.endsWith("]")) {
+                return `:${m.slice(1, -1)}?`;
+            }
+            return `:${m}`;
+        });
+        return routePath?.length > 0 ? `/${routePath}` : "/";
+    }
+    toRoute(src) {
+        const path = this.toPath(src);
+        if (src.endsWith(".md") || src.endsWith(".mdx")) {
+            return {
+                page: true,
+                $component: {
+                    src: src,
+                    pick: ["$css"],
+                },
+                $$route: undefined,
+                path,
+                // filePath: src
+            };
+        }
+        const exports = analyzeModule(src);
+        const exportNames = exports.map(getExportName);
+        const localExportNames = exports.map(getLocalExportName).filter(name => name !== undefined);
+        const hasDefault = exportNames.includes("default");
+        const hasRouteConfig = exportNames.includes("route");
+        if (hasDefault) {
+            return {
+                page: true,
+                $component: {
+                    src: src,
+                    pick: [...localExportNames.filter(name => name !== "route"), "default", "$css"],
+                },
+                $$route: hasRouteConfig
+                    ? {
+                        src: src,
+                        pick: ["route"],
+                    }
+                    : undefined,
+                path,
+                // filePath: src
+            };
+        }
+    }
+}
+const HTTP_METHODS = ["HEAD", "GET", "POST", "PUT", "DELETE", "PATCH", "OPTIONS"];
+function getExportName(entry) {
+    return entry.exportName.name ?? "default";
+}
+function getLocalExportName(entry) {
+    const name = getExportName(entry);
+    if (name === "default")
+        return;
+    return name === (entry.localName.name ?? entry.importName.name ?? name) ? name : undefined;
+}
+function createHTTPHandlers(src, exports) {
+    const handlers = {};
+    for (const exp of exports) {
+        if (HTTP_METHODS.includes(exp)) {
+            handlers[`$${exp}`] = {
+                src: src,
+                pick: [exp],
+            };
+            if (exp === "GET" && !exports.includes("HEAD")) {
+                handlers.$HEAD = {
+                    src: src,
+                    pick: [exp],
+                };
+            }
+        }
+    }
+    return handlers;
+}
+export class SolidStartServerFileRouter extends BaseFileSystemRouter {
+    constructor(config) {
+        super(config);
+    }
+    toPath(src) {
+        const routePath = cleanPath(src, this.config)
+            // remove the initial slash
+            .slice(1)
+            .replace(/index$/, "")
+            .replace(/\[([^/]+)\]/g, (_, m) => {
+            if (m.length > 3 && m.startsWith("...")) {
+                return `*${m.slice(3)}`;
+            }
+            if (m.length > 2 && m.startsWith("[") && m.endsWith("]")) {
+                return `:${m.slice(1, -1)}?`;
+            }
+            return `:${m}`;
+        });
+        return routePath?.length > 0 ? `/${routePath}` : "/";
+    }
+    toRoute(src) {
+        const path = this.toPath(src);
+        if (src.endsWith(".md") || src.endsWith(".mdx")) {
+            return {
+                page: true,
+                $component: {
+                    src: src,
+                    pick: ["$css"],
+                },
+                $$route: undefined,
+                path,
+            };
+        }
+        const exports = analyzeModule(src);
+        const exportNames = exports.map(getExportName);
+        const localExportNames = exports.map(getLocalExportName).filter(name => name !== undefined);
+        const hasRouteConfig = exportNames.includes("route");
+        const hasDefault = exportNames.includes("default");
+        const hasAPIRoutes = exportNames.some(name => HTTP_METHODS.includes(name));
+        if (hasDefault || hasAPIRoutes) {
+            return {
+                page: hasDefault,
+                $component: !this.config.dataOnly && hasDefault
+                    ? {
+                        src: src,
+                        pick: [
+                            ...localExportNames.filter(name => name !== "route" && !HTTP_METHODS.includes(name)),
+                            "default",
+                            "$css",
+                        ],
+                    }
+                    : undefined,
+                $$route: hasRouteConfig
+                    ? {
+                        src: src,
+                        pick: ["route"],
+                    }
+                    : undefined,
+                ...createHTTPHandlers(src, exportNames),
+                path,
+            };
+        }
+    }
+}

package/dist/config/fs-routes/fs-watcher.d.ts

@@ -0,0 +1,3 @@
+import type { PluginOption } from "vite";
+import type { BaseFileSystemRouter } from "./router.ts";
+export declare const fileSystemWatcher: (routers: Record<"client" | "ssr", BaseFileSystemRouter>) => PluginOption;

package/dist/config/fs-routes/fs-watcher.js

@@ -0,0 +1,53 @@
+import { debounce } from "../../utils/debounce.js";
+import { VITE_ENVIRONMENTS } from "../constants.js";
+import { moduleId } from "./index.js";
+function setupWatcher(watcher, routes) {
+    watcher.on("unlink", path => routes.removeRoute(path));
+    watcher.on("add", path => routes.addRoute(path));
+    watcher.on("change", path => routes.updateRoute(path));
+}
+function createRoutesReloader(server, routes, environment) {
+    const devEnv = server.environments[environment];
+    if (!devEnv?.moduleGraph)
+        return;
+    /**
+     * Debounce catches multiple route changes in a row
+     * Short timeout for inexpensive invalidations
+     */
+    const invalidateModule = debounce((mod) => {
+        devEnv.moduleGraph.invalidateModule(mod);
+    }, 0);
+    /**
+     * Long debounce timeout for expensive reloads
+     */
+    const reloadModule = debounce((mod) => {
+        devEnv.reloadModule(mod);
+    }, 200);
+    return routes.on("reload", function handleRoutesReload(evt) {
+        const mod = devEnv.moduleGraph.getModuleById(moduleId);
+        if (!mod) {
+            devEnv.hot.send({ type: "full-reload" });
+            return;
+        }
+        if (environment === VITE_ENVIRONMENTS.client && evt.detail.type !== "update") {
+            // Client has to be reloaded when routes are added or removed
+            reloadModule(mod);
+        }
+        else {
+            invalidateModule(mod);
+        }
+    });
+}
+export const fileSystemWatcher = (routers) => {
+    const plugin = {
+        name: "fs-watcher",
+        async configureServer(server) {
+            for (const environment of [VITE_ENVIRONMENTS.server, VITE_ENVIRONMENTS.client]) {
+                const router = routers[environment];
+                setupWatcher(server.watcher, router);
+                createRoutesReloader(server, router, environment);
+            }
+        },
+    };
+    return plugin;
+};

package/dist/config/fs-routes/index.d.ts

@@ -0,0 +1,7 @@
+import { type PluginOption } from "vite";
+import type { BaseFileSystemRouter } from "./router.ts";
+export declare const moduleId = "solid-start:routes";
+export interface FsRoutesArgs {
+    routers: Record<"client" | "ssr", BaseFileSystemRouter>;
+}
+export declare function fsRoutes({ routers }: FsRoutesArgs): Array<PluginOption>;

package/dist/config/fs-routes/index.js

@@ -0,0 +1,107 @@
+import { relative } from "node:path";
+import { fileSystemWatcher } from "./fs-watcher.js";
+import { treeShake } from "./tree-shake.js";
+export const moduleId = "solid-start:routes";
+export function fsRoutes({ routers }) {
+    globalThis.ROUTERS = routers;
+    return [
+        {
+            name: "solid-start-fs-routes",
+            enforce: "pre",
+            resolveId(id) {
+                if (id === moduleId)
+                    return id;
+            },
+            async load(id) {
+                const root = this.environment.config.root;
+                const isBuild = this.environment.mode === "build";
+                if (id !== moduleId)
+                    return;
+                const js = jsCode();
+                const router = globalThis.ROUTERS[this.environment.name];
+                const routes = await router.getRoutes();
+                let routesCode = JSON.stringify(routes ?? [], (k, v) => {
+                    if (v === undefined)
+                        return undefined;
+                    if (k.startsWith("$$")) {
+                        const buildId = `${v.src}?${v.pick.map((p) => `pick=${p}`).join("&")}`;
+                        /**
+                         * @type {{ [key: string]: string }}
+                         */
+                        const refs = {};
+                        for (var pick of v.pick) {
+                            refs[pick] = js.addNamedImport(pick, buildId);
+                        }
+                        return {
+                            require: `_$() => ({ ${Object.entries(refs)
+                                .map(([pick, namedImport]) => `'${pick}': ${namedImport}`)
+                                .join(", ")} })$_`,
+                            // src: isBuild ? relative(root, buildId) : buildId
+                        };
+                    }
+                    else if (k.startsWith("$")) {
+                        const buildId = `${v.src}?${v.pick.map((p) => `pick=${p}`).join("&")}`;
+                        return {
+                            src: relative(root, buildId),
+                            build: isBuild ? `_$() => import('${buildId}')$_` : undefined,
+                            import: `_$() => import('${buildId}')$_`,
+                        };
+                    }
+                    return v;
+                });
+                routesCode = routesCode.replaceAll('"_$(', "(").replaceAll(')$_"', ")");
+                const code = `
+${js.getImportStatements()}
+export default ${routesCode}`;
+                return code;
+            },
+        },
+        treeShake(),
+        fileSystemWatcher(routers),
+    ];
+}
+function jsCode() {
+    const imports = new Map();
+    let vars = 0;
+    function addImport(p) {
+        let id = imports.get(p);
+        if (!id) {
+            id = {};
+            imports.set(p, id);
+        }
+        const d = "routeData" + vars++;
+        id["default"] = d;
+        return d;
+    }
+    function addNamedImport(name, p) {
+        let id = imports.get(p);
+        if (!id) {
+            id = {};
+            imports.set(p, id);
+        }
+        const d = "routeData" + vars++;
+        id[name] = d;
+        return d;
+    }
+    const getNamedExport = (p) => {
+        const id = imports.get(p);
+        delete id["default"];
+        return Object.keys(id).length > 0
+            ? `{ ${Object.keys(id)
+                .map(k => `${k} as ${id[k]}`)
+                .join(", ")} }`
+            : "";
+    };
+    const getImportStatements = () => {
+        return `${[...imports.keys()]
+            .map(i => `import ${imports.get(i).default
+            ? `${imports.get(i).default}${Object.keys(imports.get(i)).length > 1 ? ", " : ""}`
+            : ""} ${getNamedExport(i)} from '${i}';`)
+            .join("\n")}`;
+    };
+    return {
+        addImport,
+        addNamedImport,
+        getImportStatements,
+    };
+}

package/dist/config/fs-routes/router.d.ts

@@ -0,0 +1,43 @@
+import { type StaticExportEntry } from "oxc-parser";
+import { pathToRegexp } from "path-to-regexp";
+export { pathToRegexp };
+export declare const glob: (path: string) => string[];
+export type FileSystemRouterConfig = {
+    dir: string;
+    extensions: string[];
+};
+type Route = {
+    path: string;
+} & Record<string, any>;
+export declare function cleanPath(src: string, config: FileSystemRouterConfig): string;
+export declare function analyzeModule(src: string): StaticExportEntry[];
+type RouterEvent = CustomEvent<{
+    route: string;
+    type: "update" | "remove" | "add";
+}>;
+export declare class BaseFileSystemRouter extends EventTarget {
+    routes: Route[];
+    config: FileSystemRouterConfig;
+    /**
+     *
+     * @param {} config
+     */
+    constructor(config: FileSystemRouterConfig);
+    glob(): string;
+    buildRoutes(): Promise<any[]>;
+    isRoute(src: string): boolean;
+    toPath(src: string): void;
+    toRoute(src: string): Route | undefined;
+    /**
+     * To be attached by vite plugin to the vite dev server
+     */
+    update: undefined;
+    _addRoute(route: Route): boolean;
+    addRoute(src: string): Promise<void>;
+    reload(route: string, type: "update" | "remove" | "add"): void;
+    updateRoute(src_: string): Promise<void>;
+    removeRoute(src: string): void;
+    on(type: string, cb: (evt: RouterEvent) => void): () => void;
+    buildRoutesPromise?: Promise<any[]>;
+    getRoutes(): Promise<Route[]>;
+}

package/dist/config/fs-routes/router.js

@@ -0,0 +1,146 @@
+import fg from "fast-glob";
+import fs from "node:fs";
+import micromatch from "micromatch";
+import { posix } from "node:path";
+import { parseSync } from "oxc-parser";
+import { pathToRegexp } from "path-to-regexp";
+import { normalizePath } from "vite";
+export { pathToRegexp };
+export const glob = (path) => fg.sync(path, { absolute: true });
+export function cleanPath(src, config) {
+    return src
+        .slice(config.dir.length)
+        .replace(new RegExp(`\.(${(config.extensions ?? []).join("|")})$`), "");
+}
+export function analyzeModule(src) {
+    const result = parseSync(src, fs.readFileSync(src, "utf-8"), { lang: "tsx" });
+    const error = result.errors[0];
+    if (error)
+        throw new SyntaxError(`Failed to parse ${src}:\n${error.codeframe || error.message}`);
+    return result.module.staticExports.flatMap(({ entries }) => entries.filter(entry => !entry.isType && entry.exportName.kind !== "None"));
+}
+export class BaseFileSystemRouter extends EventTarget {
+    routes;
+    config;
+    /**
+     *
+     * @param {} config
+     */
+    constructor(config) {
+        super();
+        this.routes = [];
+        this.config = config;
+    }
+    glob() {
+        return (posix.join(fg.convertPathToPattern(this.config.dir), "**/*") +
+            `.{${this.config.extensions.join(",")}}`);
+    }
+    async buildRoutes() {
+        for (var src of glob(this.glob())) {
+            await this.addRoute(src);
+        }
+        return this.routes;
+    }
+    isRoute(src) {
+        return Boolean(micromatch(src, this.glob())?.length);
+    }
+    toPath(src) {
+        throw new Error("Not implemented");
+    }
+    toRoute(src) {
+        let path = this.toPath(src);
+        if (path === undefined)
+            return;
+        const exports = analyzeModule(src);
+        if (!exports.find(entry => entry.exportName.kind === "Default")) {
+            console.warn("No default export", src);
+        }
+        return {
+            $component: {
+                src: src,
+                pick: ["default", "$css"],
+            },
+            path,
+            // filePath: src
+        };
+    }
+    /**
+     * To be attached by vite plugin to the vite dev server
+     */
+    update = undefined;
+    _addRoute(route) {
+        const idx = this.routes.findIndex(r => r.path === route.path);
+        if (idx >= 0)
+            this.routes.splice(idx, 1);
+        this.routes.push(route);
+        return idx >= 0;
+    }
+    async addRoute(src) {
+        src = normalizePath(src);
+        if (this.isRoute(src)) {
+            try {
+                const route = this.toRoute(src);
+                if (route) {
+                    this._addRoute(route);
+                    this.reload(route.path, "add");
+                }
+            }
+            catch (e) {
+                console.error(e);
+            }
+        }
+    }
+    reload(route, type) {
+        this.dispatchEvent(new CustomEvent("reload", {
+            detail: {
+                route,
+                type,
+            },
+        }));
+    }
+    async updateRoute(src_) {
+        const src = normalizePath(src_);
+        if (this.isRoute(src)) {
+            try {
+                const route = this.toRoute(src);
+                if (route) {
+                    const updated = this._addRoute(route);
+                    this.reload(route.path, updated ? "update" : "add");
+                }
+                else {
+                    this.removeRoute(src_);
+                }
+            }
+            catch (e) {
+                console.error(e);
+            }
+            // this.update?.();
+        }
+    }
+    removeRoute(src) {
+        src = normalizePath(src);
+        if (this.isRoute(src)) {
+            const path = this.toPath(src);
+            if (path === undefined) {
+                return;
+            }
+            const idx = this.routes.findIndex(r => r.path === path);
+            if (idx === -1)
+                return;
+            this.routes.splice(idx, 1);
+            this.reload(path, "remove");
+        }
+    }
+    on(type, cb) {
+        this.addEventListener(type, cb);
+        return () => this.removeEventListener(type, cb);
+    }
+    buildRoutesPromise;
+    async getRoutes() {
+        if (!this.buildRoutesPromise) {
+            this.buildRoutesPromise = this.buildRoutes();
+        }
+        await this.buildRoutesPromise;
+        return this.routes;
+    }
+}

package/dist/config/fs-routes/tree-shake.d.ts

@@ -0,0 +1,2 @@
+import type { Plugin } from "vite";
+export declare function treeShake(): Plugin;