vite-plugin-react-server 1.1.9 → 1.1.11

package/plugin/helpers/inputNormalizer.ts

@@ -1,6 +1,6 @@
 import { normalizePath } from "vite";
 import type { InputNormalizer, NormalizerInput } from "../types.js";
-import path, { join } from "path";
+import path, { join, sep } from "path";
 import { DEFAULT_CONFIG } from "../config/defaults.js";
 
 let stashedNormalizer: InputNormalizer | null = null;
@@ -9,6 +9,7 @@ type CreateInputNormalizerProps = {
   root: string;
   preserveModulesRoot?: string | undefined;
   removeExtension?: boolean | RegExp | string | ((path: string) => boolean);
+  moduleBasePath?: string | undefined;
 };
 
 const resolveExtensionOptions = (
@@ -55,7 +56,10 @@ const resolveRootOption = (
       return normalizedPreserveModulesRoot.slice(root.length + 1);
     }
     return "";
-  } else if (typeof preserveModulesRoot === "string" && typeof root !== "string") {
+  } else if (
+    typeof preserveModulesRoot === "string" &&
+    typeof root !== "string"
+  ) {
     return normalizePath(preserveModulesRoot);
   }
   return "";
@@ -65,23 +69,43 @@ const createKeyNormalizer =
     root: normalizedRoot,
     preserveModulesRoot,
     handleExtension,
+    moduleBasePath,
   }: {
     root: string;
     preserveModulesRoot: string | undefined;
     handleExtension: (path: string) => string;
+    moduleBasePath: string | undefined;
   }) =>
   (key: string) => {
+    if (key.includes("?")) {
+      key = key.split("?")[0];
+    }
+
     // Handle virtual modules first
-    const virtualPrefix = key.match(/^\0+/)?.[0] || '';
-    const actualKey = key.slice(virtualPrefix.length);
-    
+    const virtualPrefix = key.match(/^\0+/) ?? "";
+    const actualKey = virtualPrefix ? key.slice(virtualPrefix[0].length) : key;
+
     let moduleId = normalizePath(actualKey);
-    
+
     // Normalize root path to handle both absolute and relative paths
     const normalizedRootPath = normalizePath(normalizedRoot);
     if (moduleId.startsWith(normalizedRootPath)) {
       moduleId = moduleId.slice(normalizedRootPath.length);
     }
+    if (
+      typeof moduleBasePath === "string" &&
+      moduleBasePath !== "" &&
+      moduleBasePath !== "/"
+    ) {
+      moduleId = moduleId.startsWith(
+        moduleBasePath.endsWith(sep) ? moduleBasePath : moduleBasePath + sep
+      )
+        ? moduleId.slice(
+            moduleBasePath.length +
+              (moduleBasePath.endsWith(sep) ? 0 : sep.length)
+          )
+        : moduleId;
+    }
 
     moduleId = handleExtension(moduleId);
     while (moduleId.startsWith("/") || moduleId.startsWith(".")) {
@@ -95,7 +119,7 @@ const createKeyNormalizer =
         ? moduleId.slice(preserveModulesRoot.length + path.sep.length)
         : moduleId;
     }
-    
+
     // Add virtual prefix back
     return virtualPrefix + moduleId;
   };
@@ -104,18 +128,37 @@ const createPathNormalizer =
   ({
     root,
     preserveModulesRoot,
+    moduleBasePath,
   }: {
     root: string;
     preserveModulesRoot: string | undefined;
+    moduleBasePath: string | undefined;
   }) =>
   (path: string) => {
     if (typeof path !== "string") {
       throw new Error(`Invalid path: ${JSON.stringify(path)}`);
     }
+    if (path.includes("?")) {
+      path = path.split("?")[0];
+    }
     let normalPath = normalizePath(path);
-    if(normalPath.startsWith(root)) {
+    if (normalPath.startsWith(root)) {
       normalPath = normalPath.slice(root.length);
     }
+    if (
+      typeof moduleBasePath === "string" &&
+      moduleBasePath !== "" &&
+      moduleBasePath !== "/"
+    ) {
+      normalPath = normalPath.startsWith(
+        moduleBasePath.endsWith(sep) ? moduleBasePath : moduleBasePath + sep
+      )
+        ? normalPath.slice(
+            moduleBasePath.length +
+              (moduleBasePath.endsWith(sep) ? 0 : sep.length)
+          )
+        : normalPath;
+    }
     if (typeof preserveModulesRoot === "string" && preserveModulesRoot !== "") {
       normalPath = normalPath.startsWith(preserveModulesRoot)
         ? normalPath.slice(preserveModulesRoot.length)
@@ -135,10 +178,11 @@ const createPathNormalizer =
  */
 export function createInputNormalizer({
   root,
+  moduleBasePath,
   preserveModulesRoot = undefined,
   removeExtension = DEFAULT_CONFIG.MODULE_EXTENSION,
 }: CreateInputNormalizerProps): InputNormalizer {
-  if(stashedNormalizer) {
+  if (stashedNormalizer) {
     return stashedNormalizer;
   }
   const relativeRoot = resolveRootOption(root, preserveModulesRoot);
@@ -147,10 +191,12 @@ export function createInputNormalizer({
     root: root,
     preserveModulesRoot: preserveModulesRoot,
     handleExtension,
+    moduleBasePath,
   });
   const normalizeEntryPath = createPathNormalizer({
     root: root,
     preserveModulesRoot: relativeRoot,
+    moduleBasePath,
   });
   function normalizeInput(id: NormalizerInput): [string, string] {
     // Normalize both paths to use POSIX separators
@@ -185,19 +231,22 @@ export function createInputNormalizer({
       return normalized;
     }
     throw new Error(`Invalid input type: ${typeof id}`);
-  };
+  }
 
   stashedNormalizer = (input: NormalizerInput): [string, string] => {
     const [key, path] = normalizeInput(input);
     // Apply the same normalization to both key and path
-    const normalizedPath = path.startsWith('/') ? path.slice(1) : path;
-    const virtualPrefix = key.match(/^\0+/)?.[0] || '';
-    
+    const normalizedPath = path.startsWith("/") ? path.slice(1) : path;
+    const virtualPrefix = key.match(/^\0+/) ?? "";
     // If key has virtual prefix, ensure path has it too
-    const finalPath = virtualPrefix ? 
-      (normalizedPath.startsWith(virtualPrefix) ? normalizedPath : virtualPrefix + normalizedPath) : 
-      normalizedPath;
-    
+    const finalPath = virtualPrefix
+      ? virtualPrefix.length && normalizedPath.startsWith(virtualPrefix[0])
+        ? normalizedPath
+        : virtualPrefix.length
+        ? virtualPrefix[0] + normalizedPath
+        : normalizedPath
+      : normalizedPath;
+
     return [key, finalPath];
   };
   return stashedNormalizer;

package/plugin/helpers/requestInfo.ts

@@ -0,0 +1,91 @@
+import { join } from "node:path";
+import type { ResolvedUserOptions } from "../types.js";
+import type { Connect } from "vite";
+import { MIME_TYPES } from "../config/mimeTypes.js";
+
+/**
+ * # Request info
+ * 
+ * Does the initial work to check if the request is for html, rsc, css, or something else not handled by this plugin.
+ * 
+ * @param req 
+ * @param userOptions 
+ * @param hostDir 
+ * @returns 
+ */
+export function requestInfo(
+  req: Connect.IncomingMessage,
+  userOptions: Pick<ResolvedUserOptions, "normalizer" | "build" | "autoDiscover">,
+  hostDir: string
+) {
+  const [, value] = userOptions.normalizer(req.url);
+  const dotIndex = value.lastIndexOf(".");
+  const ext = dotIndex === -1 ? "" : value.slice(dotIndex);
+  // handle index.html
+  const isHtml = userOptions.autoDiscover.htmlPattern(value);
+  const hasHtmlHeader = req.headers.accept?.includes("text/html");
+  const isRsc = userOptions.autoDiscover.rscPattern(value);
+  const hasRscHeader = req.headers.accept?.includes("text/x-component");
+  const isFolder = !ext;
+  const isHtmlRequest =
+    isHtml || hasHtmlHeader || (isFolder && !hasRscHeader && !isRsc);
+  const isRscRequest = !isHtmlRequest && (isRsc || hasRscHeader);
+  const isCss = userOptions.autoDiscover.cssPattern(value);
+  const isCssRequest =
+    !isHtmlRequest &&
+    !isRscRequest &&
+    (isCss || req.headers.accept?.includes("text/css"));
+  let filePath = join(hostDir, value);
+  let contentType;
+  if (isHtmlRequest) {
+    if (!isHtml) {
+      filePath = join(hostDir, value, userOptions.build.htmlOutputPath);
+    }
+    contentType = "text/html; charset=utf-8";
+  } else if (isRscRequest) {
+    if (!isRsc) {
+      filePath = join(hostDir, value, userOptions.build.rscOutputPath);
+    }
+    contentType = "text/x-component; charset=utf-8";
+  } else if (isCssRequest) {
+    if (!isCss) {
+      filePath = join(hostDir, value);
+    }
+    contentType = "text/css; charset=utf-8";
+  } else {
+    const mimeType = MIME_TYPES[ext];
+    if (mimeType) {
+      contentType = mimeType;
+    } else {
+      contentType = "application/octet-stream";
+    }
+  }
+  const route = value
+    .replace(userOptions.build.rscOutputPath, "")
+    .replace(userOptions.build.htmlOutputPath, "");
+    
+  const routeWithoutTrailingSlash =
+    route === "" || route === "/"
+      ? "/"
+      : route.endsWith("/")
+      ? route.slice(0, -1)
+      : route;
+  const routeWithLeadingSlash =
+    routeWithoutTrailingSlash.startsWith("/")
+      ? routeWithoutTrailingSlash
+      : `/${routeWithoutTrailingSlash}`;
+
+  return {
+    route: routeWithLeadingSlash,
+    ext,
+    isHtmlRequest,
+    isRscRequest,
+    isCssRequest,
+    isCss,
+    isHtml,
+    isRsc,
+    isFolder,
+    contentType,
+    filePath,
+  };
+}

package/plugin/{resolvePage.ts → helpers/resolvePage.ts}

@@ -1,3 +1,4 @@
+import { toError } from "../error/toError.js";
 
 type ResolvePageOptions<N extends string> = {
   id: string;
@@ -16,7 +17,7 @@ type ResolvePageResult<T, N extends string> =
  * During development (ssrLoadModule):
  * - Real modules have exports available directly on the module object
  * - Virtual modules have exports stored in temporaryReferences
- * 
+ *
  * @param options.id - The module ID to resolve
  * @param options.exportName - The name of the export to resolve (e.g. 'Page')
  * @param options.loader - The loader function to use for loading the module
@@ -58,17 +59,31 @@ export const resolvePage = async <T, N extends string>({
   if (module instanceof Error) {
     return {
       type: "error",
-      error: module,
+      error: {
+        name: module.name,
+        message: module.message,
+        stack: module.stack,
+      },
     };
   } else if (!(exportName in module)) {
+    if ("error" in module) {
+      return {
+        type: "error",
+        error: toError(module.error),
+      };
+    }
     return {
       type: "error",
-      error: new Error(`Export ${exportName} not found in module ${id}`),
+      error: new Error(
+        `Export "${exportName}" not found in module ${id}.`
+      ),
     };
   } else if (!Page) {
     return {
       type: "error",
-      error: new Error(`Export ${exportName} is null or undefined in module ${id}`),
+      error: new Error(
+        `Export "${exportName}" is null or undefined in module ${id}.`
+      ),
     };
   } else if (Page instanceof Error) {
     return {

package/plugin/helpers/resolvePageAndProps.ts

@@ -1,5 +1,5 @@
-import { resolvePage } from "../resolvePage.js";
-import { resolveProps } from "../resolveProps.js";
+import { resolvePage } from "./resolvePage.js";
+import { resolveProps } from "./resolveProps.js";
 
 type ResolvePageAndPropsOptions<N1 extends string, N2 extends string> = {
   pagePath: string;
@@ -52,8 +52,11 @@ export async function resolvePageAndProps<
         ? handlerOptions.loader
         : async () => {
             const resolvePageResult = await resolvePagePromise;
-            if (resolvePageResult.type != "success") {
-              return resolvePageResult;
+            if (resolvePageResult.type === "error") {
+              return resolvePageResult.error
+            }
+            if (resolvePageResult.type === "skip") {
+              return null;
             }
             return resolvePageResult.module;
           },

package/plugin/{resolveProps.ts → helpers/resolveProps.ts}

@@ -1,3 +1,4 @@
+import { toError } from "../error/toError.js";
 
 type ResolvePropsOptions<N extends string> = {
   id: string;
@@ -53,15 +54,16 @@ export const resolveProps = async <T, N extends string>({
     | { type: "error"; error: Error; module?: never }
   > => {
     try {
+      const result = await loader(id);
       return {
         type: "success",
         key: id,
-        module: await loader(id),
+        module: result,
       };
     } catch (error) {
       return {
         type: "error",
-        error: error instanceof Error ? error : new Error(String(error)),
+        error: toError(error),
       };
     }
   })();
@@ -117,7 +119,7 @@ export const resolveProps = async <T, N extends string>({
     } catch (error) {
       return {
         type: "error",
-        error: error instanceof Error ? error : new Error(String(error)),
+        error: toError(error),
       };
     }
   } else if (props instanceof Promise) {
@@ -132,7 +134,7 @@ export const resolveProps = async <T, N extends string>({
     } catch (error) {
       return {
         type: "error",
-        error: error instanceof Error ? error : new Error(String(error)),
+        error: toError(error),
       };
     }
   } else if (Array.isArray(props)) {
@@ -149,7 +151,7 @@ export const resolveProps = async <T, N extends string>({
     } catch (error) {
       return {
         type: "error",
-        error: error instanceof Error ? error : new Error(String(error)),
+        error: toError(error),
       };
     }
   } else if (typeof props === "string") {
@@ -162,7 +164,7 @@ export const resolveProps = async <T, N extends string>({
     } catch (error) {
       return {
         type: "error",
-        error: error instanceof Error ? error : new Error(String(error)),
+        error: toError(error),
       };
     }
   }

package/plugin/helpers/serializeUserOptions.ts

@@ -190,7 +190,7 @@ export const serializedOptions = <T extends ResolvedUserOptions>(
     autoDiscover,
     ...handlerOptions
   } = userOptions;
-  const { entryFile, chunkFile, assetFile, pages, ...buildOptions } = build;
+  const { entryFile, chunkFile, assetFile, pages, ...buildOptions } = build ?? {};
   const result = {
     ...handlerOptions,
     build: {

package/plugin/helpers/tryManifest.ts

@@ -38,7 +38,6 @@ export async function tryManifest<SSR extends boolean>(
       manifest: result,
     };
   } catch (e) {
-    console.trace("No manifest found", manifestPath);
     return {
       type: "error",
       error: e as Error,

package/plugin/loader/createBuildLoader.ts

@@ -1,7 +1,7 @@
 import { join } from "node:path";
 import type { ResolvedUserConfig, ResolvedUserOptions } from "../../server.js";
 import type { Manifest } from "vite";
-import { getModuleRef } from "../moduleRefs.js";
+import { getModuleRef } from "../helpers/moduleRefs.js";
 import { readFile } from "node:fs/promises";
 import type { OutputBundle } from "rollup";
 import { temporaryReferences } from "./temporaryReferences.js";

package/plugin/loader/css-loader.development.ts

@@ -6,6 +6,7 @@ import { preprocessCSS } from "vite";
 import type { ResolvedConfig } from "vite";
 import { readFile } from "node:fs/promises";
 import { join } from "node:path";
+import { env } from "../utils/env.js";
 
 /**
  * Global port for communication between the main thread and the CSS loader.
@@ -21,14 +22,7 @@ const cssFilesByPage = new Map<string, Set<string>>();
 
 let currentPage: string | null = null;
 let resolvedConfig: ResolvedConfig | undefined;
-// Get environment variables
-const env = import.meta?.env || {
-  BASE_URL: '/',
-  DEV: true,
-  MODE: 'development',
-  PROD: false,
-  SSR: true
-};
+
 
 /**
  * Initializes the CSS loader with the necessary communication channels.

package/plugin/loader/env-loader.development.ts

@@ -0,0 +1,84 @@
+import type { LoadHookContext } from "node:module";
+import type { LoaderContext } from "../types.js";
+import type { MessagePort } from "node:worker_threads";
+import type { ResolvedConfig } from "vite";
+
+export let loaderPort: MessagePort | undefined;
+let resolvedConfig: ResolvedConfig | undefined;
+
+// Initialize hook
+export async function initialize(data: { port: MessagePort, resolvedConfig: ResolvedConfig }) {
+  loaderPort = data.port;
+  resolvedConfig = data.resolvedConfig;
+  data.port.postMessage({ type: "INITIALIZED_ENV_LOADER" });
+}
+
+// Load hook
+export async function load(
+  url: string,
+  context: LoadHookContext & LoaderContext,
+  nextLoad: any
+) {
+  const result = await nextLoad(url, context);
+
+  // Skip if not a module
+  if (result.format !== "module") {
+    return result;
+  }
+
+  // Skip node internals and hidden files
+  if (url.startsWith('node:') || url.includes('/.')) {
+    return result;
+  }
+
+  // Convert source to string if it's a Buffer or Uint8Array
+  let sourceStr: string;
+  if (typeof result.source === "string") {
+    sourceStr = result.source;
+  } else if (result.source instanceof Uint8Array || Buffer.isBuffer(result.source)) {
+    sourceStr = result.source.toString("utf-8");
+  } else {
+    console.warn(`[env-loader] Unexpected source type: ${typeof result.source}`);
+    return result;
+  }
+
+  // Get define object from resolved config
+  const define = resolvedConfig?.define || {};
+
+  // Create the env object with Vite's default environment variables
+  const envObject = {
+    MODE: resolvedConfig?.mode || 'development',
+    BASE_URL: resolvedConfig?.base || '/',
+    PROD: resolvedConfig?.isProduction ? true : false,
+    DEV: resolvedConfig?.isProduction ? false : true,
+    SSR: true,
+    ...Object.fromEntries(
+      Object.entries(define)
+        .filter(([key]) => key.startsWith('import.meta.env.'))
+        .map(([key, value]) => [key.replace('import.meta.env.', ''), JSON.parse(value as string)])
+    )
+  };
+
+  // Replace environment variable references in the source
+  let newSource = sourceStr;
+  
+  // Check if we need to handle import.meta.env
+  if (newSource.includes('import.meta.env')) {
+    newSource = `Object.defineProperty(import.meta, "env", { value: ${JSON.stringify(envObject)}, writable: false, configurable: false });\n${newSource}`;
+  }
+
+  return {
+    ...result,
+    source: newSource
+  };
+}
+
+// Transform hook
+export async function transformSource(
+  source: string,
+  context: any,
+  defaultTransformSource: any
+) {
+  const transformed = await defaultTransformSource(source, context, defaultTransformSource);
+  return transformed;
+}

package/plugin/loader/react-loader.ts

@@ -8,9 +8,9 @@ import {
   type LoadHookContext,
   type ResolveHookContext,
 } from "node:module";
-import { workerData } from "node:worker_threads";
 import type { MessagePort } from "node:worker_threads";
 import type { LoaderContext } from "../types.js";
+import { env } from '../utils/env.js';
 
 let stashedGetSource: any = null;
 let stashedResolve: any = null;
@@ -21,15 +21,6 @@ setSourceMapsSupport(true, {
   generatedCode: true, // Enable for generated code
 });
 
-// Get environment variables from workerData or import.meta
-const env = workerData?.importMeta?.env ||
-  import.meta?.env || {
-    BASE_URL: "/",
-    DEV: false,
-    MODE: "production",
-    PROD: true,
-    SSR: true,
-  };
 
 // Store port globally for use in load hook
 export let loaderPort: MessagePort | undefined;

package/plugin/metrics/formatMetrics.ts

@@ -12,7 +12,8 @@ export function formatMetrics(metrics: RenderMetrics): string {
   } = metrics;
 
   // Format memory usage in MB
-  const formatMemory = (bytes: number) => `${(bytes / 1024 / 1024).toFixed(2)}MB`;
+  const formatMemory = (bytes: number) =>
+    `${(bytes / 1024 / 1024).toFixed(2)}MB`;
 
   return `
 Route: ${route}
@@ -32,6 +33,30 @@ Stream:
 `.trim();
 }
 
-export function logMetrics(metrics: RenderMetrics) {
-  console.log(formatMetrics(metrics));
-} 
+export function metricWatcher({
+  maxTime = 200,
+  warnOnly = false,
+  warn = console.warn,
+  info = console.info,
+}: {
+  maxTime?: number;
+  warnOnly?: boolean;
+  warn?: (...args: any[]) => void;
+  info?: (...args: any[]) => void;
+}) {
+  return (metrics: RenderMetrics) => {
+    if (metrics.processingTime > maxTime) {
+      warn(`It took over ${maxTime}ms to render ${metrics.route}`);
+      warn(formatMetrics(metrics));
+    } else if (!warnOnly) {
+      const rounded = Math.round(metrics.processingTime);
+      if (rounded === 0) {
+        // smaller unit of time
+        const rounded = Math.round(metrics.processingTime * 1000);
+        info(`${metrics.route} (${rounded}μs)`);
+      } else {
+        info(`${metrics.route} (${rounded}ms)`);
+      }
+    }
+  };
+}

package/plugin/plugin.client.ts

@@ -2,9 +2,11 @@ import { reactPreservePlugin } from "./preserver/plugin.js";
 import { reactTransformPlugin } from "./transformer/plugin.client.js";
 import type { StreamPluginOptions } from "../types.js";
 import { reactClientPlugin } from "./react-client/plugin.js";
+import { envPlugin } from "./env/plugin.js";
 
 export function vitePluginReactServer(options = {} as StreamPluginOptions): import("vite").Plugin[] {
     return [
+      envPlugin(),
       reactClientPlugin(options),
       reactTransformPlugin(options),
       reactPreservePlugin(options),

package/plugin/plugin.server.ts

@@ -3,6 +3,7 @@ import { reactStaticPlugin } from "./react-static/plugin.js";
 import { reactTransformPlugin } from "./transformer/plugin.server.js";
 import type { StreamPluginOptions } from "./types.js";
 import { reactServerPlugin } from "./react-server/plugin.js";
+import { envPlugin } from "./env/plugin.js";
 
 
 export function vitePluginReactServer(
@@ -11,12 +12,14 @@ export function vitePluginReactServer(
   if(!options.build?.pages || (Array.isArray(options.build.pages) && options.build.pages.length === 0)) {
     // in this case we do not need the static plugin at all
     return [
+      envPlugin(),
       reactTransformPlugin(options),
       reactServerPlugin(options),
       reactPreservePlugin(options),
     ];
   }
   return [
+    envPlugin(),
     reactTransformPlugin(options),
     reactServerPlugin(options),
     reactStaticPlugin(options),

package/plugin/plugin.ts

@@ -1,5 +1,3 @@
 import { getCondition } from './config/getCondition.js';
 
-const condition = getCondition().slice(6); // remove react-
-
-export const { vitePluginReactServer } = await import(`./plugin.${condition}.js`);
+export const { vitePluginReactServer } = await import(`./plugin.${getCondition('')}.js`);

package/plugin/preserver/plugin.ts

@@ -155,3 +155,4 @@ export function reactPreservePlugin(_options: StreamPluginOptions): import("vite
     },
   };
 }
+

package/plugin/process-env.ts

@@ -0,0 +1,13 @@
+declare global {
+  namespace NodeJS {
+    interface ProcessEnv {
+      VITE_BASE_URL: string;
+      VITE_DEV: string;
+      VITE_PROD: string;
+      VITE_SSR: string;
+      VITE_MODE: string;
+      VITE_PUBLIC_ORIGIN: string;
+    }
+  }
+}
+export {};