@solidjs/start 2.0.0-alpha.3 → 2.0.0-beta.1

package/CHANGELOG.md

@@ -1,5 +1,28 @@
 # @solidjs/start
 
+## 2.0.0-beta.1
+
+### Patch Changes
+
+- ee1193a: Update srvx to maintain response compatibility with Nitro v3.
+- e263338: Fix `ERR_UNSUPPORTED_ESM_URL_SCHEME` when running `vite preview` on Windows
+
+## 2.0.0-beta.0
+
+### Minor Changes
+
+- 0a9fdc3: fix cloudflare
+
+### Patch Changes
+
+- 0c95804: Fix URL to path conversion in manifest resolver
+- 6011e5a: Fixed changes in route files resulting in a reload instead of hot module replace. Reloads now only are triggered when adding or removing routes.
+- 8fb81e6: Fixed niche edge cases in the server functions dead code removal (DCE) logic:
+  - Server functions only referenced in event handlers (e.g. `onClick`) now aren't considered unused and work properly.
+  - Unused variables in server functions no longer lead to compilation errors.
+- 8d12d6a: Fixed tailwind class changes not getting applied via HMR in filesystem routes.
+- ec1b82b: Included Vite 8 in the peer dependency range.
+
 ## 2.0.0-alpha.3
 
 ### Minor Changes

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@solidjs/start",
-  "version": "2.0.0-alpha.3",
+  "version": "2.0.0-beta.1",
   "type": "module",
   "repository": {
     "type": "git",
@@ -48,27 +48,28 @@
     "shiki": "^1.29.2",
     "solid-js": "^1.9.11",
     "source-map-js": "^1.2.1",
-    "srvx": "^0.11.9",
+    "srvx": "^0.11.22",
     "terracotta": "^1.1.0",
     "vite-plugin-solid": "^2.11.11"
   },
   "engines": {
-    "node": ">=22"
+    "node": ">=24"
   },
   "devDependencies": {
     "@types/babel__core": "^7.20.5",
     "@types/node": "^25.5.0",
-    "vite": "^7.3.1",
+    "vite": "^8.0.0",
     "vitest": "^4.1.0"
   },
   "peerDependencies": {
-    "vite": "^7"
+    "vite": "^7 || ^8"
   },
   "scripts": {
     "build": "pnpm validate-imports && tsc && node scripts/build.js",
     "dev": "tsc --watch",
     "test": "vitest",
     "test:ci": "vitest run",
+    "typecheck:dist": "pnpm build && pnpx @arethetypeswrong/cli --pack . --profile esm-only",
     "validate-imports": "node scripts/validate-imports.js"
   }
 }

package/src/config/constants.ts

@@ -14,6 +14,6 @@ export const VIRTUAL_MODULES = {
 } as const;
 
 export const VITE_ENVIRONMENTS = {
-  client: "client",
-  server: "ssr",
+  client: "client" as const,
+  server: "ssr" as const,
 };

package/src/config/dev-server.ts

@@ -1,3 +1,5 @@
+import { join } from "node:path";
+import { pathToFileURL } from "node:url";
 import { NodeRequest, sendNodeResponse } from "srvx/node";
 import {
   type Connect,
@@ -18,7 +20,9 @@ export function devServer(): Array<PluginOption> {
             const webReq = new NodeRequest({ req, res });
             const def: {
               default: { fetch: (req: Request) => Promise<Response> };
-            } = await import(process.cwd() + "/dist/server/entry-server.js");
+            } = await import(
+              pathToFileURL(join(process.cwd(), "dist/server/entry-server.js")).href
+            );
             sendNodeResponse(res, await def.default.fetch(webReq));
           });
         };

package/src/config/fs-routes/fs-watcher.ts

@@ -1,22 +1,10 @@
-import type {
-  EnvironmentModuleNode,
-  FSWatcher,
-  PluginOption,
-  ViteDevServer,
-} from "vite";
+import type { EnvironmentModuleNode, FSWatcher, PluginOption, ViteDevServer } from "vite";
+import { debounce } from "../../utils/debounce.ts";
 import { VITE_ENVIRONMENTS } from "../constants.ts";
 import { moduleId } from "./index.ts";
 import type { BaseFileSystemRouter } from "./router.ts";
 
-interface CompiledRouter {
-  removeRoute(path: string): void;
-  addRoute(path: string): void;
-  updateRoute(path: string): void;
-  addEventListener(event: "reload", handler: () => void): void;
-  removeEventListener(event: "reload", handler: () => void): void;
-}
-
-function setupWatcher(watcher: FSWatcher, routes: CompiledRouter): void {
+function setupWatcher(watcher: FSWatcher, routes: BaseFileSystemRouter): void {
   watcher.on("unlink", path => routes.removeRoute(path));
   watcher.on("add", path => routes.addRoute(path));
   watcher.on("change", path => routes.updateRoute(path));
@@ -24,33 +12,41 @@ function setupWatcher(watcher: FSWatcher, routes: CompiledRouter): void {
 
 function createRoutesReloader(
   server: ViteDevServer,
-  routes: CompiledRouter,
+  routes: BaseFileSystemRouter,
   environment: "client" | "ssr",
-): () => void {
-  routes.addEventListener("reload", handleRoutesReload);
-  return () => routes.removeEventListener("reload", handleRoutesReload);
+) {
+  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: EnvironmentModuleNode) => {
+    devEnv.moduleGraph.invalidateModule(mod);
+  }, 0);
 
-  function handleRoutesReload(): void {
-    const envName =
-      environment === "ssr" ? VITE_ENVIRONMENTS.server : VITE_ENVIRONMENTS.client;
-    const devEnv = server.environments[envName];
-    if (!devEnv?.moduleGraph) return;
+  /**
+   * Long debounce timeout for expensive reloads
+   */
+  const reloadModule = debounce((mod: EnvironmentModuleNode) => {
+    devEnv.reloadModule(mod);
+  }, 200);
 
-    const mod: EnvironmentModuleNode | undefined =
-      devEnv.moduleGraph.getModuleById(moduleId);
-    if (mod) {
-      const seen = new Set<EnvironmentModuleNode>();
-      devEnv.moduleGraph.invalidateModule(mod, seen);
+  return routes.on("reload", function handleRoutesReload(evt): void {
+    const mod = devEnv.moduleGraph.getModuleById(moduleId)!;
+    if (!mod) {
+      devEnv.hot.send({ type: "full-reload" });
+      return;
     }
 
-    if (environment !== "ssr") {
-      if (mod) {
-        devEnv.reloadModule(mod);
-      } else if (devEnv.hot) {
-        devEnv.hot.send({ type: "full-reload" });
-      }
+    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 = (
@@ -59,11 +55,11 @@ export const fileSystemWatcher = (
   const plugin: PluginOption = {
     name: "fs-watcher",
     async configureServer(server: ViteDevServer) {
-      Object.keys(routers).forEach(environment => {
-        const router = (globalThis as any).ROUTERS[environment];
+      for (const environment of [VITE_ENVIRONMENTS.server, VITE_ENVIRONMENTS.client]) {
+        const router = routers[environment];
         setupWatcher(server.watcher, router);
-        createRoutesReloader(server, router, environment as keyof typeof routers);
-      });
+        createRoutesReloader(server, router, environment);
+      }
     },
   };
   return plugin;

package/src/config/fs-routes/router.ts

@@ -32,6 +32,8 @@ export function analyzeModule(src: string) {
   );
 }
 
+type RouterEvent = CustomEvent<{ route: string; type: "update" | "remove" | "add" }>;
+
 export class BaseFileSystemRouter extends EventTarget {
   routes: Route[];
 
@@ -98,8 +100,11 @@ export class BaseFileSystemRouter extends EventTarget {
   update = undefined;
 
   _addRoute(route: Route) {
-    this.routes = this.routes.filter(r => r.path !== route.path);
+    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: string) {
@@ -109,7 +114,7 @@ export class BaseFileSystemRouter extends EventTarget {
         const route = this.toRoute(src);
         if (route) {
           this._addRoute(route);
-          this.reload(route.path);
+          this.reload(route.path, "add");
         }
       } catch (e) {
         console.error(e);
@@ -117,25 +122,27 @@ export class BaseFileSystemRouter extends EventTarget {
     }
   }
 
-  reload(route: string) {
+  reload(route: string, type: "update" | "remove" | "add") {
     this.dispatchEvent(
-      new Event("reload", {
-        // @ts-ignore
+      new CustomEvent("reload", {
         detail: {
           route,
+          type,
         },
       }),
     );
   }
 
-  async updateRoute(src: string) {
-    src = normalizePath(src);
+  async updateRoute(src_: string) {
+    const src = normalizePath(src_);
     if (this.isRoute(src)) {
       try {
         const route = this.toRoute(src);
         if (route) {
-          this._addRoute(route);
-          this.reload(route.path);
+          const updated = this._addRoute(route);
+          this.reload(route.path, updated ? "update" : "add");
+        } else {
+          this.removeRoute(src_);
         }
       } catch (e) {
         console.error(e);
@@ -151,11 +158,20 @@ export class BaseFileSystemRouter extends EventTarget {
       if (path === undefined) {
         return;
       }
-      this.routes = this.routes.filter(r => r.path !== path);
-      this.dispatchEvent(new Event("reload", {}));
+
+      const idx = this.routes.findIndex(r => r.path === path);
+      if (idx === -1) return;
+
+      this.routes.splice(idx, 1);
+      this.reload(path, "remove");
     }
   }
 
+  on(type: string, cb: (evt: RouterEvent) => void) {
+    this.addEventListener(type, cb as any);
+    return () => this.removeEventListener(type, cb as any);
+  }
+
   buildRoutesPromise?: Promise<any[]>;
 
   async getRoutes() {

package/src/config/fs-routes/tree-shake.ts

@@ -6,7 +6,7 @@ import type * as Babel from "@babel/core";
 import type { NodePath, PluginObj, PluginPass } from "@babel/core";
 import type { Binding } from "@babel/traverse";
 import { basename } from "pathe";
-import type { Plugin, ResolvedConfig, ViteDevServer } from "vite";
+import type { Plugin } from "vite";
 
 type State = Omit<PluginPass, "opts"> & {
   opts: { pick: string[] };
@@ -280,10 +280,6 @@ function treeShakeTransform({ types: t }: typeof Babel): PluginObj<State> {
 }
 
 export function treeShake(): Plugin {
-  let config: ResolvedConfig;
-  const cache: Record<string, any> = {};
-  let server: ViteDevServer;
-
   async function transform(id: string, code: string) {
     const [path, queryString] = id.split("?");
     const query = new URLSearchParams(queryString);
@@ -308,46 +304,6 @@ export function treeShake(): Plugin {
   return {
     name: "tree-shake",
     enforce: "pre",
-    configResolved(resolvedConfig) {
-      config = resolvedConfig;
-    },
-    configureServer(s) {
-      server = s;
-    },
-    async handleHotUpdate(ctx) {
-      if (cache[ctx.file]) {
-        const mods = [];
-        const newCode = await ctx.read();
-        for (const [id, code] of Object.entries(cache[ctx.file])) {
-          const transformed = await transform(id, newCode);
-          if (!transformed) continue;
-
-          const { code: transformedCode } = transformed;
-
-          if (transformedCode !== code) {
-            const mod = server.moduleGraph.getModuleById(id);
-            if (mod) mods.push(mod);
-          }
-
-          cache[ctx.file] ??= {};
-          cache[ctx.file][id] = transformedCode;
-          // server.moduleGraph.setModuleSource(id, code);
-        }
-
-        return mods;
-      }
-      // 	const mods = [];
-      // 	[...server.moduleGraph.urlToModuleMap.entries()].forEach(([url, m]) => {
-      // 		if (m.file === ctx.file && m.id.includes("pick=")) {
-      // 			if (!m.id.includes("pick=loader")) {
-      // 				mods.push(m);
-      // 			}
-      // 		}
-      // 	});
-      // 	return mods;
-      // 	// this.router.updateRoute(ctx.path);
-      // }
-    },
     async transform(code, id) {
       const [path, queryString] = id.split("?");
       if (!path) return;
@@ -358,9 +314,6 @@ export function treeShake(): Plugin {
         const transformed = await transform(id, code);
         if (!transformed?.code) return;
 
-        cache[path] ??= {};
-        cache[path][id] = transformed.code;
-
         return {
           code: transformed.code,
           map: transformed.map,

package/src/config/index.ts

@@ -63,6 +63,18 @@ export function solidStart(options?: SolidStartOptions): Array<PluginOption> {
     server: `${start.appRoot}/entry-server${entryExtension}`,
   };
   return [
+    // TODO (Alexis): check if the comment below is still relevant
+    //
+    // Must be placed after fsRoutes, as treeShake will remove the
+    // server fn exports added in by this plugin
+    serverFunctionsPlugin({
+      manifest: VIRTUAL_MODULES.serverFnManifest,
+      runtime: {
+        server: '@solidjs/start/fns/server',
+        client: '@solidjs/start/fns/client',
+      },
+      filter: options?.serverFunctions?.filter,
+    }),
     {
       name: "solid-start:config",
       enforce: "pre",
@@ -190,16 +202,6 @@ export function solidStart(options?: SolidStartOptions): Array<PluginOption> {
     }),
     lazy(),
     envPlugin(options?.env),
-    // Must be placed after fsRoutes, as treeShake will remove the
-    // server fn exports added in by this plugin
-    serverFunctionsPlugin({
-      manifest: VIRTUAL_MODULES.serverFnManifest,
-      runtime: {
-        server: '@solidjs/start/fns/server',
-        client: '@solidjs/start/fns/client',
-      },
-      filter: options?.serverFunctions?.filter,
-    }),
     {
       name: "solid-start:virtual-modules",
       async resolveId(id) {

package/src/config/lazy.ts

@@ -90,6 +90,7 @@ const lazy = (): PluginOption => {
       // The transformed files either import "lazy" or css files
       // Therefore we skip, if the src doesn't have any import
       if (src.indexOf("import") === -1) return;
+      if (id.includes("entry-server")) return;
 
       const plugins: PluginItem[] = [];
 

package/src/config/manifest.ts

@@ -1,6 +1,7 @@
 import fs from "node:fs";
 import path from "node:path";
 import { type PluginOption, type ViteDevServer, version as viteVersion } from "vite";
+import { fileURLToPath } from "node:url";
 
 import { findStylesInModuleGraph } from "../server/collect-styles.ts";
 import { VIRTUAL_MODULES } from "./constants.ts";
@@ -20,12 +21,16 @@ export function manifest(start: SolidStartOptions): PluginOption {
         return `\0${VIRTUAL_MODULES.clientViteManifest}`;
       if (id === VIRTUAL_MODULES.getClientManifest)
         return this.resolve(
-          new URL("../server/manifest/client-manifest", import.meta.url).pathname,
+          fileURLToPath(new URL("../server/manifest/client-manifest", import.meta.url)),
         );
       if (id === VIRTUAL_MODULES.getManifest) {
         return this.environment.config.consumer === "client"
-          ? this.resolve(new URL("../server/manifest/client-manifest", import.meta.url).pathname)
-          : this.resolve(new URL("../server/manifest/ssr-manifest", import.meta.url).pathname);
+          ? this.resolve(
+              fileURLToPath(new URL("../server/manifest/client-manifest", import.meta.url)),
+            )
+          : this.resolve(
+              fileURLToPath(new URL("../server/manifest/ssr-manifest", import.meta.url)),
+            );
       }
       if (id === VIRTUAL_MODULES.middleware) {
         if (start.middleware) return await this.resolve(start.middleware);

package/src/directives/index.ts

@@ -196,6 +196,7 @@ export function serverFunctionsPlugin(options: ServerFunctionsOptions): Plugin[]
     },
     {
       name: "solid-start:server-functions/compiler",
+      enforce: 'pre',
       async transform(code, fileId, opts) {
         const mode = opts?.ssr ? "server" : "client";
         const [id] = fileId.split("?");

package/src/directives/remove-unused-variables.ts

@@ -2,6 +2,20 @@ import type * as babel from "@babel/core";
 import * as t from "@babel/types";
 import { isPathValid } from "./paths.ts";
 
+function isInvalidForRemoval(path: babel.NodePath) {
+  if (isPathValid(path, t.isCatchClause)) {
+    // This case is for `catch (error)` blocks
+    return true;
+  }
+
+  // This one is for destructured variables
+  let target = path;
+  if (isPathValid(path, t.isVariableDeclarator)) {
+    target = path.get('id');
+  }
+  return isPathValid(target, t.isObjectPattern) || isPathValid(target, t.isArrayPattern);
+}
+
 export function removeUnusedVariables(program: babel.NodePath<t.Program>) {
   // TODO(Alexis):
   // This implementation is simple but slow
@@ -24,17 +38,18 @@ export function removeUnusedVariables(program: babel.NodePath<t.Program>) {
             case "hoisted":
             case "module":
               if (binding.references === 0 && !binding.path.removed) {
-                if (isPathValid(binding.path.parentPath, t.isImportDeclaration)) {
                   const parent = binding.path.parentPath;
+                if (isPathValid(parent, t.isImportDeclaration)) {
                   if (parent.node.specifiers.length === 1) {
                     parent.remove();
                   } else {
                     binding.path.remove();
                   }
-                } else {
+                  dirty = true;
+                } else if (!(isInvalidForRemoval(binding.path))) {
                   binding.path.remove();
+                  dirty = true;
                 }
-                dirty = true;
               }
               break;
             case "local":

package/src/server/handler.ts

@@ -1,5 +1,5 @@
 import middleware from "solid-start:middleware";
-import { defineHandler, getCookie, H3, type H3Event, redirect, setCookie } from "h3";
+import { defineHandler, getCookie, H3, type H3Event, redirect, setCookie } from "h3/generic";
 import { join } from "pathe";
 import type { JSX } from "solid-js";
 import { sharedConfig } from "solid-js";

package/src/utils/debounce.ts

@@ -0,0 +1,10 @@
+/**
+ * Creates a debounced function that delays the invocation of a function
+ */
+export const debounce = <T extends (...args: any[]) => void>(cb: T, debounceMs: number) => {
+  let timeout: NodeJS.Timeout | undefined;
+  return (...args: Parameters<T>) => {
+    clearTimeout(timeout);
+    timeout = setTimeout(() => cb(...args), debounceMs)
+  }
+}

package/dist/client/StartClient.d.ts

@@ -1,7 +0,0 @@
-import type { JSX } from "solid-js";
-/**
- *
- * Read more: https://docs.solidjs.com/solid-start/reference/client/start-client
- */
-export declare function StartClient(): JSX.Element;
-export declare function StartClientTanstack(): JSX.Element;

package/dist/client/StartClient.jsx

@@ -1,26 +0,0 @@
-// @refresh skip
-import App from "solid-start:app";
-import { ErrorBoundary } from "../shared/ErrorBoundary.jsx";
-function Dummy(props) {
-    return props.children;
-}
-/**
- *
- * Read more: https://docs.solidjs.com/solid-start/reference/client/start-client
- */
-export function StartClient() {
-    return (<Dummy>
-      <Dummy>
-        <ErrorBoundary>
-          <App />
-        </ErrorBoundary>
-      </Dummy>
-    </Dummy>);
-}
-export function StartClientTanstack() {
-    return (<Dummy>
-      <ErrorBoundary>
-        <App />
-      </ErrorBoundary>
-    </Dummy>);
-}

package/dist/client/index.d.ts

@@ -1,2 +0,0 @@
-export { mount } from "./mount.ts";
-export { StartClient, StartClientTanstack } from "./StartClient.tsx";

package/dist/client/index.jsx

@@ -1,2 +0,0 @@
-export { mount } from "./mount.js";
-export { StartClient, StartClientTanstack } from "./StartClient.jsx";

package/dist/client/mount.d.ts

@@ -1 +0,0 @@
-export { hydrate as mount } from "solid-js/web";

package/dist/client/mount.js

@@ -1 +0,0 @@
-export { hydrate as mount } from "solid-js/web";

package/dist/client/spa/index.d.ts

@@ -1,4 +0,0 @@
-import type { JSX } from "solid-js";
-import { type MountableElement } from "solid-js/web";
-export declare function mount(fn: () => JSX.Element, el: MountableElement): void;
-export { StartClient } from "../StartClient.tsx";

package/dist/client/spa/index.jsx

@@ -1,5 +0,0 @@
-import { render } from "solid-js/web";
-export function mount(fn, el) {
-    render(fn, el);
-}
-export { StartClient } from "../StartClient.jsx";

package/dist/config/constants.d.ts

@@ -1,16 +0,0 @@
-export declare const DEFAULT_EXTENSIONS: string[];
-export declare const CLIENT_BASE_PATH = "_build";
-export declare const VIRTUAL_MODULES: {
-    readonly clientViteManifest: "solid-start:client-vite-manifest";
-    readonly getClientManifest: "solid-start:get-client-manifest";
-    readonly getManifest: "solid-start:get-manifest";
-    readonly middleware: "solid-start:middleware";
-    readonly serverFnManifest: "solid-start:server-fn-manifest";
-    readonly clientEntry: "solid-start:client-entry";
-    readonly serverEntry: "solid-start:server-entry";
-    readonly app: "solid-start:app";
-};
-export declare const VITE_ENVIRONMENTS: {
-    client: string;
-    server: string;
-};

package/dist/config/constants.js

@@ -1,16 +0,0 @@
-export const DEFAULT_EXTENSIONS = ["js", "jsx", "ts", "tsx"];
-export const CLIENT_BASE_PATH = "_build";
-export const VIRTUAL_MODULES = {
-    clientViteManifest: "solid-start:client-vite-manifest",
-    getClientManifest: "solid-start:get-client-manifest",
-    getManifest: "solid-start:get-manifest",
-    middleware: "solid-start:middleware",
-    serverFnManifest: "solid-start:server-fn-manifest",
-    clientEntry: "solid-start:client-entry",
-    serverEntry: "solid-start:server-entry",
-    app: "solid-start:app",
-};
-export const VITE_ENVIRONMENTS = {
-    client: "client",
-    server: "ssr",
-};

package/dist/config/dev-server.d.ts

@@ -1,2 +0,0 @@
-import { type PluginOption } from "vite";
-export declare function devServer(): Array<PluginOption>;