@qwik.dev/router 2.0.0-beta.37 → 2.0.0-beta.39

package/lib/vite/index.mjs

@@ -1,9 +1,12 @@
 import { mergeConfig, normalizePath as normalizePath$1, loadEnv } from 'vite';
 import fs, { existsSync } from 'node:fs';
+import { readFile } from 'node:fs/promises';
 import path, { join, dirname, basename, resolve, isAbsolute, extname } from 'node:path';
-import { g as getExtension, r as removeExtension, i as isIndexModule, a as isErrorName, b as isLayoutModule, c as isEntryName, d as isMenuFileName, e as isServiceWorkerName, f as isPageModuleExt, h as isModuleExt, j as isMarkdownExt, k as normalizePath, l as getPathnameFromDirPath, m as getMenuPathname, o as createFileId, p as parseRouteIndexName, q as isPluginModule, s as isPageExt } from '../chunks/fs.mjs';
+import { findExports, findStaticImports } from 'mlly';
+import { g as getExtension, r as removeExtension, i as isIndexModule, a as isErrorName, b as isPageModuleExt, c as isModuleExt, d as isMarkdownExt, e as isLayoutModule, f as isEntryName, h as isMenuFileName, j as isServiceWorkerName, k as normalizePath, l as getPathnameFromDirPath, m as getMenuPathname, o as createFileId, p as parseRouteIndexName, q as errorBoundaryName, s as isPluginModule, t as isPageExt } from '../chunks/fs.mjs';
 import { a as addError, b as addWarning } from '../chunks/format.mjs';
 import { i as isSameOriginUrl, e as ensureSlash } from '../chunks/pathname.mjs';
+import { c as createRouteTester } from '../chunks/routes.mjs';
 import { marked } from 'marked';
 import { createHash } from 'node:crypto';
 import { SourceMapGenerator } from 'source-map';
@@ -16,6 +19,8 @@ import { toString } from 'hast-util-to-string';
 import { refractor } from 'refractor';
 import tsxLang from 'refractor/lang/tsx.js';
 import { optimize } from 'svgo';
+import { r as recognizeRequest, I as IsQLoader, t as trimRecognizedInternalPathname, a as resolveValidInternalFullPathname } from '../chunks/request-path.mjs';
+import { d as devPreloadedRouteLoaders } from '../chunks/dev-preloaded-route-loader.mjs';
 
 function extendConfig(baseConfigExport, serverConfigExport) {
   return async (env) => {
@@ -263,43 +268,6 @@ function parseRoutePathname(basePathname, pathname) {
   };
 }
 
-function routeSortCompare(a, b) {
-  const maxSegments = Math.max(a.segments.length, b.segments.length);
-  for (let i = 0; i < maxSegments; i += 1) {
-    const sa = a.segments[i];
-    const sb = b.segments[i];
-    if (!sa) {
-      return a.pathname.includes("[...") ? 1 : -1;
-    }
-    if (!sb) {
-      return b.pathname.includes("[...") ? -1 : 1;
-    }
-    const maxParts = Math.max(sa.length, sb.length);
-    for (let i2 = 0; i2 < maxParts; i2 += 1) {
-      const pa = sa[i2];
-      const pb = sb[i2];
-      if (pa === void 0) {
-        return pb.dynamic ? -1 : 1;
-      }
-      if (pb === void 0) {
-        return pa.dynamic ? 1 : -1;
-      }
-      if (pa.dynamic !== pb.dynamic) {
-        return pa.dynamic ? 1 : -1;
-      }
-      if (pa.dynamic) {
-        if (pa.rest !== pb.rest) {
-          return pa.rest ? 1 : -1;
-        }
-      }
-    }
-  }
-  if (a.pathname === b.pathname) {
-    return a.ext > b.ext ? -1 : 1;
-  }
-  return a.pathname < b.pathname ? -1 : 1;
-}
-
 const LAYOUT_ID = "layout";
 const LAYOUT_NAMED_PREFIX = LAYOUT_ID + "-";
 const LAYOUT_TOP_SUFFIX = "!";
@@ -335,8 +303,9 @@ function resolveRoute(opts, appLayouts, sourceFile) {
   const routesDir = opts.routesDir;
   const { layoutName, layoutStop } = parseRouteIndexName(sourceFile.extlessName);
   let pathname = getPathnameFromDirPath(opts, sourceFile.dirPath);
-  if (sourceFile.extlessName === "404" || sourceFile.extlessName === "error") {
-    pathname += sourceFile.extlessName + ".html";
+  const boundary = errorBoundaryName(sourceFile.extlessName);
+  if (boundary) {
+    pathname += boundary + ".html";
   }
   if (!layoutStop) {
     let currentDir = normalizePath(dirname(filePath));
@@ -374,6 +343,43 @@ function resolveRoute(opts, appLayouts, sourceFile) {
   };
 }
 
+function routeSortCompare(a, b) {
+  const maxSegments = Math.max(a.segments.length, b.segments.length);
+  for (let i = 0; i < maxSegments; i += 1) {
+    const sa = a.segments[i];
+    const sb = b.segments[i];
+    if (!sa) {
+      return a.pathname.includes("[...") ? 1 : -1;
+    }
+    if (!sb) {
+      return b.pathname.includes("[...") ? -1 : 1;
+    }
+    const maxParts = Math.max(sa.length, sb.length);
+    for (let i2 = 0; i2 < maxParts; i2 += 1) {
+      const pa = sa[i2];
+      const pb = sb[i2];
+      if (pa === void 0) {
+        return pb.dynamic ? -1 : 1;
+      }
+      if (pb === void 0) {
+        return pa.dynamic ? 1 : -1;
+      }
+      if (pa.dynamic !== pb.dynamic) {
+        return pa.dynamic ? 1 : -1;
+      }
+      if (pa.dynamic) {
+        if (pa.rest !== pb.rest) {
+          return pa.rest ? 1 : -1;
+        }
+      }
+    }
+  }
+  if (a.pathname === b.pathname) {
+    return a.ext > b.ext ? -1 : 1;
+  }
+  return a.pathname < b.pathname ? -1 : 1;
+}
+
 function parseDirName(name) {
   if (name.startsWith("(") && name.endsWith(")")) {
     return {
@@ -412,7 +418,6 @@ async function walkRouteDir(node, dirPath) {
         if (!child) {
           child = {
             _files: [],
-            _dirPath: itemPath,
             children: /* @__PURE__ */ new Map()
           };
           node.children.set(itemName, child);
@@ -423,7 +428,6 @@ async function walkRouteDir(node, dirPath) {
         if (!child) {
           child = {
             _files: [],
-            _dirPath: itemPath,
             children: /* @__PURE__ */ new Map()
           };
           if (parsed.paramName) {
@@ -457,7 +461,6 @@ async function walkRoutes(routesDir) {
   const dirPath = normalizePath(routesDir);
   const root = {
     _files: [],
-    _dirPath: dirPath,
     children: /* @__PURE__ */ new Map()
   };
   await walkRouteDir(root, dirPath);
@@ -642,7 +645,7 @@ function rewriteRoutes(ctx, routes) {
 function applyRewriteRoutes(root, rewriteConfigs) {
   const routables = [];
   function walk(node, steps) {
-    const hasRoute = node._files.some((f) => f.type === "route" && f.extlessName !== "error" && f.extlessName !== "404");
+    const hasRoute = node._files.some((f) => f.type === "route" && !isErrorName(f.extlessName));
     if (hasRoute) {
       routables.push({
         steps: [
@@ -672,7 +675,12 @@ function applyRewriteRoutes(root, rewriteConfigs) {
   for (const config of rewriteConfigs) {
     const translations = config.paths || {};
     const translatable = new Set(Object.keys(translations).map((k) => k.toLowerCase()));
+    const isExcluded = config.exclude?.length ? createRouteTester("/", config.exclude, void 0) : void 0;
     for (const { steps } of routables) {
+      const originalKeyPath = steps.map((s) => s.key).join("/");
+      if (isExcluded?.("/" + originalKeyPath)) {
+        continue;
+      }
       const hasTranslatable = steps.some((s) => translatable.has(s.key));
       if (!hasTranslatable && !config.prefix) {
         continue;
@@ -680,7 +688,6 @@ function applyRewriteRoutes(root, rewriteConfigs) {
       if (steps.length === 0 && !config.prefix) {
         continue;
       }
-      const originalKeyPath = steps.map((s) => s.key).join("/");
       const translatedSteps = [];
       if (config.prefix) {
         translatedSteps.push({
@@ -704,7 +711,6 @@ function applyRewriteRoutes(root, rewriteConfigs) {
         if (!child) {
           child = {
             _files: [],
-            _dirPath: "",
             children: /* @__PURE__ */ new Map()
           };
           if (step.paramName) {
@@ -832,7 +838,6 @@ function createBuildContext(rootDir, viteBasePath, userOpts, target, dynamicImpo
     opts: normalizeOptions(rootDir, viteBasePath, userOpts),
     routeTrie: {
       _files: [],
-      _dirPath: "",
       children: /* @__PURE__ */ new Map()
     },
     routes: [],
@@ -1290,6 +1295,20 @@ function resolveNamedLayoutChain(ancestorLayouts, nodeLayouts, targetName) {
   }
   return result;
 }
+function buildLoaderChainExpr(extlessName, loaderExpr, ancestorLayouts, nodeLayouts) {
+  const { layoutName, layoutStop } = parseRouteIndexName(extlessName);
+  if (layoutStop) {
+    return `[ ${loaderExpr} ]`;
+  }
+  if (layoutName) {
+    const chain = resolveNamedLayoutChain(ancestorLayouts, nodeLayouts, layoutName);
+    return `[ ${[
+      ...chain.map((l) => l.id),
+      loaderExpr
+    ].join(", ")} ]`;
+  }
+  return loaderExpr;
+}
 function getClientRouteBundleNames(qwikPlugin, r) {
   const bundlesNames = [];
   const manifest = qwikPlugin.api.getManifest();
@@ -1318,7 +1337,7 @@ function getClientRouteBundleNames(qwikPlugin, r) {
   }
   return bundlesNames;
 }
-function serializeBuildTrie(ctx, qwikPlugin, node, layoutIdMap, routeIdMap, menuIdMap, errorFiles, notFoundFiles, ancestorLayouts, isSSR, indent, loadersByFile) {
+function serializeBuildTrie(ctx, qwikPlugin, node, layoutIdMap, routeIdMap, menuIdMap, ancestorLayouts, isSSR, indent, loadersByFile, routeLoaderSourceFiles) {
   const lines = [];
   const nextIndent = indent + "  ";
   if (node._P) {
@@ -1335,7 +1354,6 @@ function serializeBuildTrie(ctx, qwikPlugin, node, layoutIdMap, routeIdMap, menu
   }
   let layoutExpr;
   let indexExpr;
-  let indexIsOverride = false;
   let errorExpr;
   let notFoundExpr;
   let menuExpr;
@@ -1376,28 +1394,14 @@ function serializeBuildTrie(ctx, qwikPlugin, node, layoutIdMap, routeIdMap, menu
     if (!loaderExpr) {
       continue;
     }
-    const isError = file.extlessName === "error";
-    const is404 = file.extlessName === "404";
-    if (isError) {
-      errorExpr = loaderExpr;
-      errorFiles.set(node._dirPath, file.filePath);
-    } else if (is404) {
-      notFoundExpr = loaderExpr;
-      notFoundFiles.set(node._dirPath, file.filePath);
+    const expr = buildLoaderChainExpr(file.extlessName, loaderExpr, ancestorLayouts, nodeLayouts);
+    const boundary = errorBoundaryName(file.extlessName);
+    if (boundary === "404") {
+      notFoundExpr = expr;
+    } else if (boundary === "error") {
+      errorExpr = expr;
     } else {
-      const { layoutName, layoutStop } = parseRouteIndexName(file.extlessName);
-      if (layoutStop) {
-        indexExpr = `[ ${loaderExpr} ]`;
-        indexIsOverride = true;
-      } else if (layoutName) {
-        const chain = resolveNamedLayoutChain(ancestorLayouts, nodeLayouts, layoutName);
-        const chainExprs = chain.map((l) => l.id);
-        chainExprs.push(loaderExpr);
-        indexExpr = `[ ${chainExprs.join(", ")} ]`;
-        indexIsOverride = true;
-      } else {
-        indexExpr = loaderExpr;
-      }
+      indexExpr = expr;
       bundleRoute = ctx.routes.find((r) => r.filePath === file.filePath);
     }
   }
@@ -1405,11 +1409,7 @@ function serializeBuildTrie(ctx, qwikPlugin, node, layoutIdMap, routeIdMap, menu
     lines.push(`${nextIndent}_L: ${layoutExpr},`);
   }
   if (indexExpr) {
-    if (indexIsOverride) {
-      lines.push(`${nextIndent}_I: ${indexExpr},`);
-    } else {
-      lines.push(`${nextIndent}_I: ${indexExpr},`);
-    }
+    lines.push(`${nextIndent}_I: ${indexExpr},`);
     if (isSSR && bundleRoute) {
       const bundleNames = getClientRouteBundleNames(qwikPlugin, bundleRoute);
       if (bundleNames.length > 0) {
@@ -1418,16 +1418,22 @@ function serializeBuildTrie(ctx, qwikPlugin, node, layoutIdMap, routeIdMap, menu
     }
   }
   {
-    const routeFiles = node._files.filter((f) => f.type === "route" || f.type === "layout").map((f) => f.filePath);
+    const routeFiles = [];
+    for (const file of node._files.filter((f) => f.type === "layout" || f.type === "route" && routeIdMap.has(f.filePath))) {
+      routeFiles.push(file.filePath, ...routeLoaderSourceFiles?.get(file.filePath) ?? []);
+    }
     if (node === ctx.routeTrie) {
       for (const plugin of ctx.serverPlugins) {
-        routeFiles.push(plugin.filePath);
+        routeFiles.push(plugin.filePath, ...routeLoaderSourceFiles?.get(plugin.filePath) ?? []);
       }
     }
-    if (routeFiles.length > 0) {
+    const routeLoaderFiles = [
+      ...new Set(routeFiles)
+    ];
+    if (routeLoaderFiles.length > 0) {
       if (loadersByFile) {
         const nodeLoaderHashes = [];
-        for (const filePath of routeFiles) {
+        for (const filePath of routeLoaderFiles) {
           const hashes = loadersByFile.get(filePath);
           if (hashes) {
             nodeLoaderHashes.push(...hashes);
@@ -1437,7 +1443,7 @@ function serializeBuildTrie(ctx, qwikPlugin, node, layoutIdMap, routeIdMap, menu
           lines.push(`${nextIndent}_R: ${JSON.stringify(nodeLoaderHashes)},`);
         }
       } else {
-        const placeholder = `__LOADERS:${routeFiles.join("|")}__`;
+        const placeholder = `__LOADERS:${routeLoaderFiles.join("|")}__`;
         lines.push(`${nextIndent}_R: ${JSON.stringify(placeholder)},`);
       }
     }
@@ -1474,7 +1480,7 @@ function serializeBuildTrie(ctx, qwikPlugin, node, layoutIdMap, routeIdMap, menu
     groupChildren.sort((a, b) => a[0].localeCompare(b[0]));
     const groupStrs = [];
     for (const [_key, child] of groupChildren) {
-      const childStr = serializeBuildTrie(ctx, qwikPlugin, child, layoutIdMap, routeIdMap, menuIdMap, errorFiles, notFoundFiles, childAncestors, isSSR, nextIndent, loadersByFile);
+      const childStr = serializeBuildTrie(ctx, qwikPlugin, child, layoutIdMap, routeIdMap, menuIdMap, childAncestors, isSSR, nextIndent, loadersByFile, routeLoaderSourceFiles);
       if (childStr !== "{}") {
         groupStrs.push(childStr);
       }
@@ -1484,7 +1490,7 @@ function serializeBuildTrie(ctx, qwikPlugin, node, layoutIdMap, routeIdMap, menu
     }
   }
   for (const [key, child] of regularChildren) {
-    const childStr = serializeBuildTrie(ctx, qwikPlugin, child, layoutIdMap, routeIdMap, menuIdMap, errorFiles, notFoundFiles, childAncestors, isSSR, nextIndent, loadersByFile);
+    const childStr = serializeBuildTrie(ctx, qwikPlugin, child, layoutIdMap, routeIdMap, menuIdMap, childAncestors, isSSR, nextIndent, loadersByFile, routeLoaderSourceFiles);
     if (childStr !== "{}") {
       const keyStr = JSON.stringify(key);
       lines.push(`${nextIndent}${keyStr}: ${childStr},`);
@@ -1497,14 +1503,12 @@ function serializeBuildTrie(ctx, qwikPlugin, node, layoutIdMap, routeIdMap, menu
 ${lines.join("\n")}
 ${indent}}`;
 }
-function createRoutes(ctx, qwikPlugin, c, esmImports, isSSR, loadersByFile) {
+function createRoutes(ctx, qwikPlugin, c, esmImports, isSSR, loadersByFile, serverExcludePaths, routeLoaderSourceFiles) {
   const includeEndpoints = isSSR;
   const dynamicImports = ctx.dynamicImports;
   const layoutIdMap = /* @__PURE__ */ new Map();
   const routeIdMap = /* @__PURE__ */ new Map();
   const menuIdMap = /* @__PURE__ */ new Map();
-  const errorFiles = /* @__PURE__ */ new Map();
-  const notFoundFiles = /* @__PURE__ */ new Map();
   let layoutCount = 0;
   let routeCount = 0;
   let menuCount = 0;
@@ -1556,6 +1560,9 @@ function createRoutes(ctx, qwikPlugin, c, esmImports, isSSR, loadersByFile) {
 /** Qwik Router Routes (${routeCount}) */`);
   for (const route of ctx.routes) {
     if (isPageExt(route.ext)) {
+      if (serverExcludePaths?.has(route.filePath)) {
+        continue;
+      }
       const importPath = getImportPath(route.filePath);
       let loaderExpr;
       if (dynamicImports) {
@@ -1571,7 +1578,7 @@ function createRoutes(ctx, qwikPlugin, c, esmImports, isSSR, loadersByFile) {
       routeIdMap.set(route.filePath, `()=>${route.id}`);
     }
   }
-  const trieStr = serializeBuildTrie(ctx, qwikPlugin, ctx.routeTrie, layoutIdMap, routeIdMap, menuIdMap, errorFiles, notFoundFiles, [], isSSR, "", loadersByFile);
+  const trieStr = serializeBuildTrie(ctx, qwikPlugin, ctx.routeTrie, layoutIdMap, routeIdMap, menuIdMap, [], isSSR, "", loadersByFile, routeLoaderSourceFiles);
   const baseSegments = ctx.opts.basePathname.split("/").filter((s) => s.length > 0);
   let routesExpr = trieStr;
   for (let j = baseSegments.length - 1; j >= 0; j--) {
@@ -1596,7 +1603,7 @@ function createServerPlugins(ctx, _qwikPlugin, c, esmImports, isSSR) {
   c.push(`];`);
 }
 
-function generateQwikRouterConfig(ctx, qwikPlugin, isSSR, loadersByFile) {
+function generateQwikRouterConfig(ctx, qwikPlugin, isSSR, loadersByFile, serverExcludePaths, routeLoaderSourceFiles) {
   const esmImports = [];
   const c = [];
   c.push(`
@@ -1607,7 +1614,7 @@ import { isDev } from '@qwik.dev/core/build';`);
     esmImports.push(`import 'virtual:qwik-router-server-fns';`);
   }
   createServerPlugins(ctx, qwikPlugin, c, esmImports, isSSR);
-  createRoutes(ctx, qwikPlugin, c, esmImports, isSSR, loadersByFile);
+  createRoutes(ctx, qwikPlugin, c, esmImports, isSSR, loadersByFile, serverExcludePaths, routeLoaderSourceFiles);
   createEntries(ctx, c);
   c.push(`export const trailingSlash = ${JSON.stringify(!globalThis.__NO_TRAILING_SLASH__)};`);
   c.push(`export const basePathname = ${JSON.stringify(ctx.opts.basePathname)};`);
@@ -1633,6 +1640,76 @@ function generateServiceWorkerRegister(ctx, swRegister) {
   return `export default ${JSON.stringify(swReg)};`;
 }
 
+const NON_GET_HANDLERS = /* @__PURE__ */ new Set([
+  "onRequest",
+  "onPost",
+  "onPut",
+  "onPatch",
+  "onDelete",
+  "onHead",
+  "onOptions"
+]);
+const ROUTER_MODULE = "@qwik.dev/router";
+const SERVER_QRL = /\b(?:routeLoader|routeAction|globalAction|server)(?:\$|Qrl)/;
+function isServerFreeSource(code) {
+  for (const e of findExports(code)) {
+    if (e.specifier) {
+      return false;
+    }
+    const names = [
+      ...e.name ? [
+        e.name
+      ] : [],
+      ...e.names ?? []
+    ];
+    if (names.some((n) => NON_GET_HANDLERS.has(n))) {
+      return false;
+    }
+  }
+  for (const imp of findStaticImports(code)) {
+    if (imp.specifier === ROUTER_MODULE && SERVER_QRL.test(imp.code)) {
+      return false;
+    }
+  }
+  return true;
+}
+function isFileServerFree(filePath, cache) {
+  let pending = cache.get(filePath);
+  if (!pending) {
+    pending = readFile(filePath, "utf-8").then(isServerFreeSource).catch(() => false);
+    cache.set(filePath, pending);
+  }
+  return pending;
+}
+async function isRouteServerFree(route, cache) {
+  if (!isMarkdownExt(route.ext) && !await isFileServerFree(route.filePath, cache)) {
+    return false;
+  }
+  for (const layout of route.layouts) {
+    if (!await isFileServerFree(layout.filePath, cache)) {
+      return false;
+    }
+  }
+  return true;
+}
+async function getServerExcludedRoutes(ctx, ssg) {
+  const excluded = /* @__PURE__ */ new Set();
+  if (!ssg?.include?.length) {
+    return excluded;
+  }
+  const isPrerendered = createRouteTester(ctx.opts.basePathname, ssg.include, ssg.exclude);
+  const serverFreeByFile = /* @__PURE__ */ new Map();
+  await Promise.all(ctx.routes.map(async (route) => {
+    if (!isPageExt(route.ext) || route.paramNames.length > 0 || /\/(?:404|error)\.html$/.test(route.pathname) || !isPrerendered(route.pathname)) {
+      return;
+    }
+    if (await isRouteServerFree(route, serverFreeByFile)) {
+      excluded.add(route.filePath);
+    }
+  }));
+  return excluded;
+}
+
 function isBundlePartOfRoute(bundle, routeAndLayoutPaths) {
   if (!bundle.origins) {
     return false;
@@ -1806,8 +1883,22 @@ function createVirtualImageJsxId(pathId, params) {
   const queryString = query.toString();
   return `${VIRTUAL_IMAGE_JSX_PREFIX}${normalizePath$1(pathId)}${VIRTUAL_IMAGE_JSX_SUFFIX}${queryString ? `?${queryString}` : ""}`;
 }
-function createImageJsxImportId(pathId, params) {
-  const query = new URLSearchParams(params);
+function createImageJsxDirectives(params, userOpts) {
+  const overrides = Object.fromEntries(params.entries());
+  delete overrides[JSX_QUERY_PARAM];
+  delete overrides[INTERNAL_IMAGE_JSX_QUERY_PARAM];
+  return new URLSearchParams({
+    format: "webp",
+    quality: "75",
+    w: "200;400;600;800;1200",
+    withoutEnlargement: "",
+    ...userOpts?.imageOptimization?.jsxDirectives,
+    ...overrides,
+    as: "jsx"
+  });
+}
+function createImageJsxImportId(pathId, params, userOpts) {
+  const query = createImageJsxDirectives(params, userOpts);
   query.set(INTERNAL_IMAGE_JSX_QUERY_PARAM, "");
   return `${normalizePath$1(pathId)}?${query.toString()}`;
 }
@@ -1835,9 +1926,10 @@ function getToImg() {
     : _jsxSplit("img", null, {decoding, height: h, loading, srcSet: s, width: w});
   `;
 }
-function createImageJsxModule(pathId, params) {
+function createImageJsxModule(pathId, params, userOpts) {
+  const importId = createImageJsxImportId(pathId, params, userOpts);
   return `
-  import { srcSet, width, height } from ${JSON.stringify(createImageJsxImportId(pathId, params))};
+  import { srcSet, width, height } from ${JSON.stringify(importId)};
   import toImg from ${JSON.stringify(TO_IMG_ID)};
 
   export default toImg(srcSet, width, height);
@@ -1935,18 +2027,7 @@ function imagePlugin(userOpts) {
       },
       defaultDirectives: (url) => {
         if (url.searchParams.has(JSX_QUERY_PARAM)) {
-          const params = Object.fromEntries(url.searchParams.entries());
-          delete params[JSX_QUERY_PARAM];
-          delete params[INTERNAL_IMAGE_JSX_QUERY_PARAM];
-          return new URLSearchParams({
-            format: "webp",
-            quality: "75",
-            w: "200;400;600;800;1200",
-            withoutEnlargement: "",
-            ...userOpts?.imageOptimization?.jsxDirectives,
-            ...params,
-            as: "jsx"
-          });
+          return createImageJsxDirectives(url.searchParams, userOpts);
         }
         return new URLSearchParams();
       }
@@ -1960,9 +2041,9 @@ function imagePlugin(userOpts) {
         order: "pre",
         async handler(id, importer, options) {
           if (parseVirtualImageJsxId(id)) {
-            return null;
+            return id;
           }
-          if (id.endsWith(TO_IMG_ID)) {
+          if (id.endsWith(TO_IMG_ID) || id === VIRTUAL_TO_IMG_ID) {
             return VIRTUAL_TO_IMG_ID;
           }
           const { pathId, params } = parseId(id);
@@ -2028,7 +2109,7 @@ function imagePlugin(userOpts) {
           }
           if (supportedExtensions.includes(imageId.extension)) {
             return {
-              code: createImageJsxModule(imageId.pathId, imageId.params),
+              code: createImageJsxModule(imageId.pathId, imageId.params, userOpts),
               map: null
             };
           }
@@ -2074,15 +2155,21 @@ async function collectServerFnModuleIds(routingContext, resolvedVirtualId, plugi
       continue;
     }
     const moduleInfo = await pluginContext.load({
-      id: resolved.id
+      id: resolved.id,
+      resolveDependencies: true
     });
     if (moduleInfo.code == null) {
       continue;
     }
+    const qwikDeps = moduleInfo.meta?.qwikdeps ?? [];
     if (moduleInfo.code.includes("serverQrl(")) {
       serverFnModules.add(moduleInfo.id);
     }
-    const resolvedImports = moduleInfo.importedIds.concat(moduleInfo.dynamicallyImportedIds);
+    const resolvedImports = [
+      ...moduleInfo.importedIds,
+      ...moduleInfo.dynamicallyImportedIds,
+      ...qwikDeps
+    ];
     for (let i = 0; i < resolvedImports.length; i++) {
       const resolvedImport = resolvedImports[i];
       if (resolvedImport && !seenModuleIds.has(resolvedImport)) {
@@ -2244,7 +2331,7 @@ class HtmlTransformPatcher {
     try {
       const fakeHtml = `<html><head>[FAKE_HEAD]</head><body>[FAKE_BODY]</body></html>`;
       const transformedHtml = await this.server.transformIndexHtml(this.request.url || "/", fakeHtml);
-      const hmrBridge = this.server.hot ? `<script type="module" src="/@id/@qwik-hmr-bridge"><\/script>` : "";
+      const hmrBridge = this.server.hot ? `<script type="module" src="${this.server.config.base}@id/@qwik-hmr-bridge"><\/script>` : "";
       const fakeHeadIndex = transformedHtml.indexOf("[FAKE_HEAD]");
       const fakeHeadCloseIndex = transformedHtml.indexOf("</head>", fakeHeadIndex);
       if (fakeHeadIndex === -1 || fakeHeadCloseIndex === -1) {
@@ -2325,6 +2412,66 @@ function wrapResponseForHtmlTransform(request, response, server) {
   return response;
 }
 
+const FULLPATH_HEADER = "X-Qwik-fullpath";
+const ROUTE_PATH_HEADER = "X-Qwik-route-path";
+function getDevMiddlewareRequestPath(req) {
+  return req.originalUrl || req.url;
+}
+async function loadSsrModule(server, filePath) {
+  return server.ssrLoadModule(getImportPath(normalizePath(filePath)));
+}
+function matchesLoaderId(loader, loaderId) {
+  return loader.__id === loaderId || loader.__qrl.getHash() === loaderId;
+}
+function isLoaderInternal(value) {
+  return typeof value === "function" && value.__brand === "server_loader";
+}
+function findMatchingLoader(mod, loaderId) {
+  for (const value of Object.values(mod)) {
+    if (isLoaderInternal(value) && matchesLoaderId(value, loaderId)) {
+      return value;
+    }
+  }
+}
+async function preloadQLoaderRouteLoader(server, ctx, req) {
+  const requestPath = getDevMiddlewareRequestPath(req);
+  if (!requestPath) {
+    return void 0;
+  }
+  let requestUrl;
+  try {
+    requestUrl = new URL(requestPath, "http://qwik.dev");
+  } catch {
+    return void 0;
+  }
+  const recognized = recognizeRequest(requestUrl.pathname);
+  if (recognized?.type !== IsQLoader || !recognized.data?.loaderId) {
+    return void 0;
+  }
+  const loaderId = recognized.data.loaderId;
+  const headerValue = req.headers[FULLPATH_HEADER.toLowerCase()] ?? req.headers[ROUTE_PATH_HEADER.toLowerCase()];
+  const fullPathHeader = Array.isArray(headerValue) ? headerValue[0] : headerValue ?? null;
+  const loaderPathname = trimRecognizedInternalPathname(requestUrl.pathname, recognized);
+  const pathname = resolveValidInternalFullPathname(loaderPathname, fullPathHeader) ?? loaderPathname;
+  const route = ctx.routes.filter((route2) => isPageExt(route2.ext)).slice().sort(routeSortCompare).find((route2) => route2.pattern.test(pathname));
+  if (!route) {
+    return void 0;
+  }
+  const routeRootFiles = [
+    ...route.layouts.map((layout) => layout.filePath),
+    route.filePath
+  ];
+  const modules = await Promise.all([
+    ...ctx.serverPlugins.map((plugin) => loadSsrModule(server, plugin.filePath)),
+    ...routeRootFiles.map((filePath) => loadSsrModule(server, filePath))
+  ]);
+  for (const mod of modules) {
+    const loader = findMatchingLoader(mod, loaderId);
+    if (loader) {
+      return loader;
+    }
+  }
+}
 const makeRouterDevMiddleware = (server, ctx) => async (req, res, next) => {
   let mod;
   try {
@@ -2344,6 +2491,11 @@ const makeRouterDevMiddleware = (server, ctx) => async (req, res, next) => {
     await updateRoutingContext(ctx);
     ctx.isDirty = false;
   }
+  const preloadedRouteLoader = await preloadQLoaderRouteLoader(server, ctx, req);
+  if (preloadedRouteLoader) {
+    await server.ssrLoadModule("@qwik-router-config");
+    devPreloadedRouteLoaders.set(req, preloadedRouteLoader);
+  }
   const entry = ctx.entries.find((e) => req.url === `${server.config.base}${e.chunkFileName}`);
   if (entry) {
     const entryContents = await server.transformRequest(`/@fs${entry.filePath.startsWith("/") ? "" : "/"}${entry.filePath}`);
@@ -2421,6 +2573,9 @@ const getCssUrls = (server) => {
         });
         if ((isEntryCSS || hasJSImporter) && !hasCSSImporter && !cssImportedByCSS.has(mod.url)) {
           cssModules.add(`${mod.url}${mod.lastHMRTimestamp ? `?t=${mod.lastHMRTimestamp}` : ""}`);
+          if (mod.file) {
+            server.watcher.add(mod.file);
+          }
         }
       }
     }
@@ -2435,10 +2590,36 @@ const getRouterIndexTags = (server) => {
     tag: "link",
     attrs: {
       rel: "stylesheet",
-      href: url
+      href: server.config.base + url.slice(1)
     }
   }));
 };
+const sendRouterCssHotUpdate = (server, file, timestamp) => {
+  const { client, ssr } = server.environments;
+  if (!isCssPath(file) || client.moduleGraph.getModulesByFile(file)?.size) {
+    return false;
+  }
+  const paths = /* @__PURE__ */ new Set();
+  for (const mod of ssr.moduleGraph.getModulesByFile(file) ?? []) {
+    mod.lastHMRTimestamp = timestamp;
+    paths.add(mod.url.split("?")[0]);
+  }
+  if (!paths.size) {
+    return false;
+  }
+  client.hot.send({
+    type: "update",
+    updates: [
+      ...paths
+    ].map((path) => ({
+      type: "css-update",
+      path,
+      acceptedPath: path,
+      timestamp
+    }))
+  });
+  return true;
+};
 
 const QWIK_ROUTER_CONFIG_ID = "@qwik-router-config";
 const QWIK_ROUTER_ENTRIES_ID = "@qwik-router-entries";
@@ -2491,6 +2672,75 @@ function isRouterSourceFileForContext(filePath, ctx) {
   const normalizedPath = normalizePath(filePath);
   return isRouterSourceFilePath(normalizedPath) && (isPathInDir(normalizedPath, ctx.opts.routesDir) || isPathInDir(normalizedPath, ctx.opts.serverPluginsDir));
 }
+function isDiscoveredRouteLoaderSource(filePath, sourceFiles) {
+  if (!sourceFiles) {
+    return false;
+  }
+  const normalizedPath = normalizePath(filePath);
+  for (const files of sourceFiles.values()) {
+    if (files.includes(normalizedPath)) {
+      return true;
+    }
+  }
+  return false;
+}
+function collectRouteLoaderOwners(node, owners) {
+  for (const file of node._files) {
+    if (file.type === "layout" || file.type === "route") {
+      owners.add(file.filePath);
+    }
+  }
+  for (const child of node.children.values()) {
+    collectRouteLoaderOwners(child, owners);
+  }
+}
+async function collectReExportSources(owner, filePath, resolveSource, sources, seen = /* @__PURE__ */ new Set([
+  owner
+])) {
+  let code, exportEntries;
+  try {
+    code = await readFile(filePath, "utf-8");
+    exportEntries = findExports(code);
+    if (!exportEntries) {
+      return;
+    }
+  } catch {
+    return;
+  }
+  await Promise.all(exportEntries.map(async (exp) => {
+    if (!exp.specifier) {
+      return;
+    }
+    const resolved = await resolveSource(exp.specifier, filePath);
+    if (!resolved || resolved.charCodeAt(0) === 0) {
+      return;
+    }
+    const resolvedPath = normalizePath(resolved.split(/[?#]/, 1)[0]);
+    let ownerSources = sources.get(owner);
+    if (!ownerSources) {
+      sources.set(owner, ownerSources = []);
+    }
+    if (!ownerSources.includes(resolvedPath)) {
+      ownerSources.push(resolvedPath);
+    }
+    if (!seen.has(resolvedPath)) {
+      seen.add(resolvedPath);
+      await collectReExportSources(owner, resolvedPath, resolveSource, sources, seen);
+    }
+  }));
+}
+async function findRouteLoaderSourceFiles(ctx, resolveSource) {
+  const sources = /* @__PURE__ */ new Map();
+  const owners = /* @__PURE__ */ new Set();
+  collectRouteLoaderOwners(ctx.routeTrie, owners);
+  for (const plugin of ctx.serverPlugins) {
+    owners.add(plugin.filePath);
+  }
+  await Promise.all([
+    ...owners
+  ].map((owner) => collectReExportSources(owner, owner, resolveSource, sources)));
+  return sources;
+}
 function invalidateRouterConfigModules(server) {
   const modules = [];
   const moduleGraphs = /* @__PURE__ */ new Set();
@@ -2545,6 +2795,8 @@ function qwikRouterPlugin(userOpts, buildContextRef) {
   const routesDir = userOpts?.routesDir ?? "src/routes";
   const serverPluginsDir = userOpts?.serverPluginsDir ?? routesDir;
   const loadersByFile = /* @__PURE__ */ new Map();
+  let reExportedRouteLoaderSources;
+  let ssgRoutePatterns;
   const api = {
     getBasePathname: () => ctx?.opts.basePathname ?? "/",
     getRoutes: () => {
@@ -2552,6 +2804,12 @@ function qwikRouterPlugin(userOpts, buildContextRef) {
     },
     getServiceWorkers: () => {
       return ctx?.serviceWorkers.slice() ?? [];
+    },
+    _setSsgRoutes: (include, exclude) => {
+      ssgRoutePatterns = include?.length ? {
+        include,
+        exclude
+      } : void 0;
     }
   };
   const plugin = {
@@ -2635,7 +2893,7 @@ function qwikRouterPlugin(userOpts, buildContextRef) {
       return updatedViteConfig;
     },
     configEnvironment(name, _config, _env) {
-      if (name === "ssr") {
+      if (name === "ssr" || name === "ssg") {
         return {
           resolve: {
             external: [
@@ -2703,11 +2961,24 @@ function qwikRouterPlugin(userOpts, buildContextRef) {
         };
       }
     },
-    handleHotUpdate({ file, modules, server }) {
-      if (!ctx || !isRouterSourceFileForContext(file, ctx)) {
+    handleHotUpdate({ file, modules, server, timestamp }) {
+      if (sendRouterCssHotUpdate(server, file, timestamp)) {
+        return [];
+      }
+      const clearedLoaderHashes = clearRouteLoaderHashes(loadersByFile, file);
+      if (!ctx) {
+        return;
+      }
+      if (!isRouterSourceFileForContext(file, ctx)) {
+        if (clearedLoaderHashes || isDiscoveredRouteLoaderSource(file, reExportedRouteLoaderSources)) {
+          const configModules2 = invalidateRouterConfigModules(server);
+          return [
+            ...modules,
+            ...configModules2
+          ];
+        }
         return;
       }
-      clearRouteLoaderHashes(loadersByFile, file);
       ctx.isDirty = true;
       const configModules = invalidateRouterConfigModules(server);
       return [
@@ -2755,7 +3026,15 @@ function qwikRouterPlugin(userOpts, buildContextRef) {
             });
           }
           if (isRouterConfig) {
-            return generateQwikRouterConfig(ctx, qwikPlugin, this.environment.config.consumer === "server", devServer ? loadersByFile : void 0);
+            const isServerConsumer = this.environment.config.consumer === "server";
+            const serverExcludePaths = isServerConsumer && !devServer && this.environment.name !== "ssg" ? await getServerExcludedRoutes(ctx, ssgRoutePatterns) : void 0;
+            reExportedRouteLoaderSources = await findRouteLoaderSourceFiles(ctx, async (specifier, importer) => {
+              const resolved = await this.resolve(specifier, importer, {
+                skipSelf: true
+              });
+              return resolved?.id;
+            });
+            return generateQwikRouterConfig(ctx, qwikPlugin, isServerConsumer, devServer ? loadersByFile : void 0, serverExcludePaths, reExportedRouteLoaderSources);
           }
           if (isSwRegister) {
             return generateServiceWorkerRegister(ctx, swRegister);
@@ -2809,6 +3088,15 @@ function qwikRouterPlugin(userOpts, buildContextRef) {
       return null;
     },
     generateBundle(_, bundles) {
+      const manifest = qwikPlugin.api.getManifest();
+      if (manifest) {
+        const srcDir = qwikPlugin.api.getOptions().srcDir;
+        for (const symbol of Object.values(manifest.symbols)) {
+          if (symbol.ctxName === "routeLoader$" && symbol.origin) {
+            addRouteLoaderHash(loadersByFile, resolve(srcDir, symbol.origin), symbol.hash);
+          }
+        }
+      }
       for (const chunk of Object.values(bundles)) {
         if (chunk.type === "chunk" && chunk.code.includes("__LOADERS:")) {
           chunk.code = replaceLoaderPlaceholders(chunk.code, loadersByFile);
@@ -2901,7 +3189,8 @@ function serverFnsPlugin(buildContextRef) {
           }
           return [
             ...serverFnModules
-          ].map((mod) => `import ${JSON.stringify(mod)};`).join("\n");
+          ].map((mod, index) => `import * as serverFnModule${index} from ${JSON.stringify(mod)};
+Object.values(serverFnModule${index});`).join("\n");
         }
         return null;
       }