@react-router/dev 0.0.0-experimental-902325fda → 0.0.0-experimental-004e483a8

package/dist/cli/index.js

@@ -1,6 +1,6 @@
 #!/usr/bin/env node
 /**
- * @react-router/dev v0.0.0-experimental-902325fda
+ * @react-router/dev v0.0.0-experimental-004e483a8
  *
  * Copyright (c) Remix Software Inc.
  *
@@ -178,7 +178,7 @@ function validateRouteConfig({
         `Route config in "${routeConfigFile}" is invalid.`,
         root ? `${root}` : [],
         nested ? Object.entries(nested).map(
-          ([path10, message]) => `Path: routes.${path10}
+          ([path9, message]) => `Path: routes.${path9}
 ${message}`
         ) : []
       ].flat().join("\n\n")
@@ -390,7 +390,8 @@ async function resolveConfig({
   }
   let future = {
     unstable_optimizeDeps: reactRouterUserConfig.future?.unstable_optimizeDeps ?? false,
-    unstable_splitRouteModules: reactRouterUserConfig.future?.unstable_splitRouteModules ?? false
+    unstable_splitRouteModules: reactRouterUserConfig.future?.unstable_splitRouteModules ?? false,
+    unstable_viteEnvironmentApi: reactRouterUserConfig.future?.unstable_viteEnvironmentApi ?? false
   };
   let reactRouterConfig = deepFreeze({
     appDirectory,
@@ -635,6 +636,25 @@ var init_profiler = __esm({
   }
 });
 
+// vite/babel.ts
+var babel_exports = {};
+__export(babel_exports, {
+  generate: () => generate,
+  parse: () => import_parser.parse,
+  t: () => t,
+  traverse: () => traverse
+});
+var import_parser, t, traverse, generate;
+var init_babel = __esm({
+  "vite/babel.ts"() {
+    "use strict";
+    import_parser = require("@babel/parser");
+    t = __toESM(require("@babel/types"));
+    traverse = require("@babel/traverse").default;
+    generate = require("@babel/generator").default;
+  }
+});
+
 // typegen/paths.ts
 function getTypesDir(ctx) {
   return Path2.join(ctx.rootDirectory, ".react-router/types");
@@ -657,7 +677,7 @@ var init_paths = __esm({
 });
 
 // typegen/generate.ts
-function generate(ctx, route) {
+function generate2(ctx, route) {
   const lineage = getRouteLineage(ctx.config.routes, route);
   const urlpath = lineage.map((route2) => route2.path).join("/");
   const typesPath = getTypesPath(ctx, route);
@@ -765,7 +785,7 @@ var init_generate = __esm({
     Path3 = __toESM(require("pathe"));
     Pathe2 = __toESM(require("pathe/utils"));
     init_paths();
-    noExtension = (path10) => Path3.join(Path3.dirname(path10), Pathe2.filename(path10));
+    noExtension = (path9) => Path3.join(Path3.dirname(path9), Pathe2.filename(path9));
   }
 });
 
@@ -817,36 +837,92 @@ async function writeAll(ctx) {
   import_node_fs3.default.rmSync(typegenDir, { recursive: true, force: true });
   Object.values(ctx.config.routes).forEach((route) => {
     const typesPath = getTypesPath(ctx, route);
-    const content = generate(ctx, route);
+    const content = generate2(ctx, route);
     import_node_fs3.default.mkdirSync(Path4.dirname(typesPath), { recursive: true });
     import_node_fs3.default.writeFileSync(typesPath, content);
   });
+  const registerPath = Path4.join(typegenDir, "+register.ts");
+  import_node_fs3.default.writeFileSync(registerPath, register(ctx));
 }
-var import_node_fs3, Path4, import_picocolors3;
+function register(ctx) {
+  const register2 = import_dedent2.default`
+    import "react-router";
+
+    declare module "react-router" {
+      interface Register {
+        params: Params;
+      }
+    }
+  `;
+  const { t: t2 } = babel_exports;
+  const typeParams = t2.tsTypeAliasDeclaration(
+    t2.identifier("Params"),
+    null,
+    t2.tsTypeLiteral(
+      Object.values(ctx.config.routes).map((route) => {
+        const lineage = getRouteLineage2(ctx.config.routes, route);
+        const fullpath = lineage.map((route2) => route2.path).join("/");
+        const params = parseParams2(fullpath);
+        return t2.tsPropertySignature(
+          t2.stringLiteral(fullpath),
+          t2.tsTypeAnnotation(
+            t2.tsTypeLiteral(
+              Object.entries(params).map(([param, isRequired]) => {
+                const property = t2.tsPropertySignature(
+                  t2.stringLiteral(param),
+                  t2.tsTypeAnnotation(t2.tsStringKeyword())
+                );
+                property.optional = !isRequired;
+                return property;
+              })
+            )
+          )
+        );
+      })
+    )
+  );
+  return [register2, generate(typeParams).code].join("\n\n");
+}
+function parseParams2(fullpath) {
+  const result = {};
+  let segments = fullpath.split("/");
+  segments.forEach((segment) => {
+    const match = segment.match(/^:([\w-]+)(\?)?/);
+    if (!match) return;
+    const param = match[1];
+    const isRequired = match[2] === void 0;
+    result[param] ||= isRequired;
+    return;
+  });
+  const hasSplat = segments.at(-1) === "*";
+  if (hasSplat) result["*"] = true;
+  return result;
+}
+function getRouteLineage2(routes2, route) {
+  const result = [];
+  while (route) {
+    result.push(route);
+    if (!route.parentId) break;
+    route = routes2[route.parentId];
+  }
+  result.reverse();
+  return result;
+}
+var import_node_fs3, import_dedent2, Path4, import_picocolors3;
 var init_typegen = __esm({
   "typegen/index.ts"() {
     "use strict";
     import_node_fs3 = __toESM(require("fs"));
+    import_dedent2 = __toESM(require("dedent"));
     Path4 = __toESM(require("pathe"));
     import_picocolors3 = __toESM(require("picocolors"));
     init_config();
+    init_babel();
     init_generate();
     init_paths();
   }
 });
 
-// vite/babel.ts
-var import_parser, t, traverse, generate2;
-var init_babel = __esm({
-  "vite/babel.ts"() {
-    "use strict";
-    import_parser = require("@babel/parser");
-    t = __toESM(require("@babel/types"));
-    traverse = require("@babel/traverse").default;
-    generate2 = require("@babel/generator").default;
-  }
-});
-
 // vite/node-adapter.ts
 var import_node_events, import_node_stream, import_set_cookie_parser, import_node;
 var init_node_adapter = __esm({
@@ -970,11 +1046,11 @@ var init_route_chunks = __esm({
 });
 
 // vite/with-props.ts
-var import_dedent2, vmod;
+var import_dedent3, vmod;
 var init_with_props = __esm({
   "vite/with-props.ts"() {
     "use strict";
-    import_dedent2 = __toESM(require("dedent"));
+    import_dedent3 = __toESM(require("dedent"));
     init_babel();
     init_virtual_module();
     vmod = create("with-props");
@@ -985,11 +1061,12 @@ var init_with_props = __esm({
 async function resolveViteConfig({
   configFile,
   mode,
-  root
+  root,
+  plugins
 }) {
   let vite2 = getVite();
   let viteConfig = await vite2.resolveConfig(
-    { mode, configFile, root },
+    { mode, configFile, root, plugins },
     "build",
     // command
     "production",
@@ -1005,6 +1082,17 @@ async function resolveViteConfig({
 async function extractPluginContext(viteConfig) {
   return viteConfig["__reactRouterPluginContext"];
 }
+function isSeverBundleEnvironmentName(name) {
+  return name.startsWith(SSR_BUNDLE_PREFIX);
+}
+function getServerEnvironmentEntries(record, buildManifest) {
+  return Object.entries(record).filter(
+    ([name]) => buildManifest.serverBundles ? isSeverBundleEnvironmentName(name) : name === "ssr"
+  );
+}
+function getServerEnvironmentKeys(record, buildManifest) {
+  return getServerEnvironmentEntries(record, buildManifest).map(([key]) => key);
+}
 function getAddressableRoutes(routes2) {
   let nonAddressableIds = /* @__PURE__ */ new Set();
   for (let id in routes2) {
@@ -1054,6 +1142,39 @@ function getRoutesByServerBundleId(buildManifest) {
   }
   return routesByServerBundleId;
 }
+async function cleanBuildDirectory(viteConfig, ctx) {
+  let buildDirectory = ctx.reactRouterConfig.buildDirectory;
+  let isWithinRoot = () => {
+    let relativePath = path7.relative(ctx.rootDirectory, buildDirectory);
+    return !relativePath.startsWith("..") && !path7.isAbsolute(relativePath);
+  };
+  if (viteConfig.build.emptyOutDir ?? isWithinRoot()) {
+    await fse.remove(buildDirectory);
+  }
+}
+async function cleanViteManifests(environmentsOptions, ctx) {
+  let viteManifestPaths = Object.entries(environmentsOptions).map(
+    ([environmentName, options]) => {
+      let outDir = options.build?.outDir;
+      invariant(outDir, `Expected build.outDir for ${environmentName}`);
+      return path7.join(outDir, ".vite/manifest.json");
+    }
+  );
+  await Promise.all(
+    viteManifestPaths.map(async (viteManifestPath) => {
+      let manifestExists = await fse.pathExists(viteManifestPath);
+      if (!manifestExists) return;
+      if (!ctx.viteManifestEnabled) {
+        await fse.remove(viteManifestPath);
+      }
+      let viteDir = path7.dirname(viteManifestPath);
+      let viteDirFiles = await fse.readdir(viteDir);
+      if (viteDirFiles.length === 0) {
+        await fse.remove(viteDir);
+      }
+    })
+  );
+}
 async function getBuildManifest(ctx) {
   let { routes: routes2, serverBundles, appDirectory } = ctx.reactRouterConfig;
   if (!serverBundles) {
@@ -1113,77 +1234,101 @@ async function getBuildManifest(ctx) {
   );
   return buildManifest;
 }
-function mergeBuildOptions(base, overrides) {
+function mergeEnvironmentOptions(base, ...overrides) {
   let vite2 = getVite();
-  return vite2.mergeConfig({ build: base }, { build: overrides }).build;
+  return overrides.reduce(
+    (merged, override) => vite2.mergeConfig(merged, override, false),
+    base
+  );
 }
-async function getEnvironmentOptionsResolvers(ctx, buildManifest) {
+async function getEnvironmentOptionsResolvers(ctx, buildManifest, viteCommand) {
   let { serverBuildFile, serverModuleFormat } = ctx.reactRouterConfig;
-  function getBaseBuildOptions({
+  let packageRoot = path7.dirname(
+    require.resolve("@react-router/dev/package.json")
+  );
+  let { moduleSyncEnabled } = await import(`file:///${path7.join(packageRoot, "module-sync-enabled/index.mjs")}`);
+  let vite2 = getVite();
+  let viteServerConditions = [
+    ...vite2.defaultServerConditions ?? [],
+    ...moduleSyncEnabled ? ["module-sync"] : []
+  ];
+  function getBaseOptions({
     viteUserConfig
   }) {
     return {
-      cssMinify: viteUserConfig.build?.cssMinify ?? true,
-      manifest: true,
-      // The manifest is enabled for all builds to detect SSR-only assets
-      rollupOptions: {
-        preserveEntrySignatures: "exports-only",
-        // Silence Rollup "use client" warnings
-        // Adapted from https://github.com/vitejs/vite-plugin-react/pull/144
-        onwarn(warning, defaultHandler) {
-          if (warning.code === "MODULE_LEVEL_DIRECTIVE" && warning.message.includes("use client")) {
-            return;
-          }
-          let userHandler = viteUserConfig.build?.rollupOptions?.onwarn;
-          if (userHandler) {
-            userHandler(warning, defaultHandler);
-          } else {
-            defaultHandler(warning);
+      build: {
+        cssMinify: viteUserConfig.build?.cssMinify ?? true,
+        manifest: true,
+        // The manifest is enabled for all builds to detect SSR-only assets
+        rollupOptions: {
+          preserveEntrySignatures: "exports-only",
+          // Silence Rollup "use client" warnings
+          // Adapted from https://github.com/vitejs/vite-plugin-react/pull/144
+          onwarn(warning, defaultHandler) {
+            if (warning.code === "MODULE_LEVEL_DIRECTIVE" && warning.message.includes("use client")) {
+              return;
+            }
+            let userHandler = viteUserConfig.build?.rollupOptions?.onwarn;
+            if (userHandler) {
+              userHandler(warning, defaultHandler);
+            } else {
+              defaultHandler(warning);
+            }
           }
         }
       }
     };
   }
-  function getBaseServerBuildOptions({
+  function getBaseServerOptions({
     viteUserConfig
   }) {
-    return mergeBuildOptions(getBaseBuildOptions({ viteUserConfig }), {
-      // We move SSR-only assets to client assets. Note that the
-      // SSR build can also emit code-split JS files (e.g. by
-      // dynamic import) under the same assets directory
-      // regardless of "ssrEmitAssets" option, so we also need to
-      // keep these JS files have to be kept as-is.
-      ssrEmitAssets: true,
-      copyPublicDir: false,
-      // Assets in the public directory are only used by the client
-      rollupOptions: {
-        output: {
-          entryFileNames: serverBuildFile,
-          format: serverModuleFormat
+    let conditions = viteCommand === "build" ? viteServerConditions : ["development", ...viteServerConditions];
+    return mergeEnvironmentOptions(getBaseOptions({ viteUserConfig }), {
+      resolve: {
+        external: ssrExternals,
+        conditions,
+        externalConditions: conditions
+      },
+      build: {
+        // We move SSR-only assets to client assets. Note that the
+        // SSR build can also emit code-split JS files (e.g. by
+        // dynamic import) under the same assets directory
+        // regardless of "ssrEmitAssets" option, so we also need to
+        // keep these JS files have to be kept as-is.
+        ssrEmitAssets: true,
+        copyPublicDir: false,
+        // Assets in the public directory are only used by the client
+        rollupOptions: {
+          output: {
+            entryFileNames: serverBuildFile,
+            format: serverModuleFormat
+          }
         }
       }
     });
   }
   let environmentOptionsResolvers = {
-    client: ({ viteUserConfig }) => ({
-      build: mergeBuildOptions(getBaseBuildOptions({ viteUserConfig }), {
+    client: ({ viteUserConfig }) => mergeEnvironmentOptions(getBaseOptions({ viteUserConfig }), {
+      build: {
         rollupOptions: {
           input: [
             ctx.entryClientFilePath,
-            ...Object.values(ctx.reactRouterConfig.routes).flatMap((route) => {
-              let routeFilePath = path7.resolve(
-                ctx.reactRouterConfig.appDirectory,
-                route.file
-              );
-              let isRootRoute = route.file === ctx.reactRouterConfig.routes.root.file;
-              let code = fse.readFileSync(routeFilePath, "utf-8");
-              return [
-                `${routeFilePath}${BUILD_CLIENT_ROUTE_QUERY_STRING}`,
-                ...ctx.reactRouterConfig.future.unstable_splitRouteModules && !isRootRoute ? routeChunkExportNames.map(
-                  (exportName) => code.includes(exportName) ? getRouteChunkModuleId(routeFilePath, exportName) : null
-                ) : []
-              ].filter(isNonNullable);
-            })
+            ...Object.values(ctx.reactRouterConfig.routes).flatMap(
+              (route) => {
+                let routeFilePath = path7.resolve(
+                  ctx.reactRouterConfig.appDirectory,
+                  route.file
+                );
+                let isRootRoute = route.file === ctx.reactRouterConfig.routes.root.file;
+                let code = fse.readFileSync(routeFilePath, "utf-8");
+                return [
+                  `${routeFilePath}${BUILD_CLIENT_ROUTE_QUERY_STRING}`,
+                  ...ctx.reactRouterConfig.future.unstable_splitRouteModules && !isRootRoute ? routeChunkExportNames.map(
+                    (exportName) => code.includes(exportName) ? getRouteChunkModuleId(routeFilePath, exportName) : null
+                  ) : []
+                ].filter(isNonNullable);
+              }
+            )
           ],
           output: {
             entryFileNames({ moduleIds }) {
@@ -1195,19 +1340,19 @@ async function getEnvironmentOptionsResolvers(ctx, buildManifest) {
           }
         },
         outDir: getClientBuildDirectory(ctx.reactRouterConfig)
-      })
+      }
     })
   };
   if (hasServerBundles(buildManifest)) {
     for (let [serverBundleId, routes2] of Object.entries(
       getRoutesByServerBundleId(buildManifest)
     )) {
-      environmentOptionsResolvers[`ssr-bundle-${serverBundleId}`] = ({
-        viteUserConfig
-      }) => ({
-        build: mergeBuildOptions(
-          getBaseServerBuildOptions({ viteUserConfig }),
-          {
+      const serverBundleEnvironmentId = serverBundleId.replaceAll("-", "_");
+      const environmentName = `${SSR_BUNDLE_PREFIX}${serverBundleEnvironmentId}`;
+      environmentOptionsResolvers[environmentName] = ({ viteUserConfig }) => mergeEnvironmentOptions(
+        getBaseServerOptions({ viteUserConfig }),
+        {
+          build: {
             outDir: getServerBuildDirectory(ctx, { serverBundleId }),
             rollupOptions: {
               input: `${virtual.serverBuild.id}?route-ids=${Object.keys(
@@ -1215,25 +1360,37 @@ async function getEnvironmentOptionsResolvers(ctx, buildManifest) {
               ).join(",")}`
             }
           }
-        )
-      });
+        },
+        // Ensure server bundle environments extend the user's SSR
+        // environment config if it exists
+        viteUserConfig.environments?.ssr ?? {}
+      );
     }
   } else {
-    environmentOptionsResolvers.ssr = ({ viteUserConfig }) => ({
-      build: mergeBuildOptions(getBaseServerBuildOptions({ viteUserConfig }), {
+    environmentOptionsResolvers.ssr = ({ viteUserConfig }) => mergeEnvironmentOptions(getBaseServerOptions({ viteUserConfig }), {
+      build: {
         outDir: getServerBuildDirectory(ctx),
         rollupOptions: {
           input: viteUserConfig.build?.rollupOptions?.input ?? virtual.serverBuild.id
         }
-      })
+      }
     });
   }
   return environmentOptionsResolvers;
 }
+function resolveEnvironmentsOptions(environmentResolvers, resolverOptions) {
+  let environmentOptions = {};
+  for (let [environmentName, resolver] of Object.entries(
+    environmentResolvers
+  )) {
+    environmentOptions[environmentName] = resolver(resolverOptions);
+  }
+  return environmentOptions;
+}
 function isNonNullable(x) {
   return x != null;
 }
-var import_node_crypto, path7, url, fse, babel2, import_react_router2, import_es_module_lexer, import_pick3, import_jsesc, import_picocolors4, import_kebabCase, BUILD_CLIENT_ROUTE_QUERY_STRING, virtualHmrRuntime, virtualInjectHmrRuntime, virtual, getServerBuildDirectory, getClientBuildDirectory, defaultEntriesDir, defaultEntries, REACT_REFRESH_HEADER;
+var import_node_crypto, path7, url, fse, babel2, import_react_router2, import_es_module_lexer, import_pick3, import_jsesc, import_picocolors4, import_kebabCase, BUILD_CLIENT_ROUTE_QUERY_STRING, SSR_BUNDLE_PREFIX, virtualHmrRuntime, virtualInjectHmrRuntime, virtual, getServerBuildDirectory, getClientBuildDirectory, defaultEntriesDir, defaultEntries, REACT_REFRESH_HEADER;
 var init_plugin = __esm({
   "vite/plugin.ts"() {
     "use strict";
@@ -1262,6 +1419,7 @@ var init_plugin = __esm({
     init_config();
     init_with_props();
     BUILD_CLIENT_ROUTE_QUERY_STRING = "?__react-router-build-client-route";
+    SSR_BUNDLE_PREFIX = "ssrBundle_";
     virtualHmrRuntime = create("hmr-runtime");
     virtualInjectHmrRuntime = create("inject-hmr-runtime");
     virtual = {
@@ -1312,34 +1470,83 @@ var build_exports = {};
 __export(build_exports, {
   build: () => build
 });
-async function cleanBuildDirectory(viteConfig, ctx) {
-  let buildDirectory = ctx.reactRouterConfig.buildDirectory;
-  let isWithinRoot = () => {
-    let relativePath = import_node_path2.default.relative(ctx.rootDirectory, buildDirectory);
-    return !relativePath.startsWith("..") && !import_node_path2.default.isAbsolute(relativePath);
-  };
-  if (viteConfig.build.emptyOutDir ?? isWithinRoot()) {
-    await import_fs_extra.default.remove(buildDirectory);
+async function build(root, viteBuildOptions) {
+  await preloadVite();
+  let vite2 = getVite();
+  let configResult = await loadConfig({ rootDirectory: root });
+  if (!configResult.ok) {
+    throw new Error(configResult.error);
+  }
+  let config = configResult.value;
+  let unstable_viteEnvironmentApi = config.future.unstable_viteEnvironmentApi;
+  let viteMajor = parseInt(vite2.version.split(".")[0], 10);
+  if (unstable_viteEnvironmentApi && viteMajor === 5) {
+    throw new Error(
+      "The future.unstable_viteEnvironmentApi option is not supported in Vite 5"
+    );
   }
+  return await (unstable_viteEnvironmentApi ? viteAppBuild(root, viteBuildOptions) : viteBuild(root, viteBuildOptions));
 }
-function getViteManifestPaths(environmentOptionsResolvers) {
-  return Object.entries(environmentOptionsResolvers).map(
-    ([environmentName, resolveOptions]) => {
-      invariant(
-        resolveOptions,
-        `Expected build environment options resolver for ${environmentName}`
-      );
-      let options = resolveOptions({
-        viteCommand: "build",
-        viteUserConfig: {}
-      });
-      let outDir = options.build.outDir;
-      invariant(outDir, `Expected build.outDir for ${environmentName}`);
-      return import_node_path2.default.join(outDir, ".vite/manifest.json");
-    }
-  );
+async function viteAppBuild(root, {
+  assetsInlineLimit,
+  clearScreen,
+  config: configFile,
+  emptyOutDir,
+  force,
+  logLevel,
+  minify,
+  mode,
+  sourcemapClient,
+  sourcemapServer
+}) {
+  let vite2 = getVite();
+  let builder = await vite2.createBuilder({
+    root,
+    mode,
+    configFile,
+    build: {
+      assetsInlineLimit,
+      emptyOutDir,
+      minify
+    },
+    optimizeDeps: { force },
+    clearScreen,
+    logLevel,
+    plugins: [
+      {
+        name: "react-router:cli-config",
+        configEnvironment(name) {
+          if (sourcemapClient && name === "client") {
+            return {
+              build: {
+                sourcemap: sourcemapClient
+              }
+            };
+          }
+          if (sourcemapServer && name !== "client") {
+            return {
+              build: {
+                sourcemap: sourcemapServer
+              }
+            };
+          }
+        },
+        configResolved(config) {
+          let hasReactRouterPlugin = config.plugins.find(
+            (plugin2) => plugin2.name === "react-router"
+          );
+          if (!hasReactRouterPlugin) {
+            throw new Error(
+              "React Router Vite plugin not found in Vite config"
+            );
+          }
+        }
+      }
+    ]
+  });
+  await builder.buildApp();
 }
-async function build(root, {
+async function viteBuild(root, {
   assetsInlineLimit,
   clearScreen,
   config: configFile,
@@ -1351,24 +1558,32 @@ async function build(root, {
   sourcemapClient,
   sourcemapServer
 }) {
-  await preloadVite();
-  let viteConfig = await resolveViteConfig({ configFile, mode, root });
-  const ctx = await extractPluginContext(viteConfig);
+  let viteUserConfig = {};
+  let viteConfig = await resolveViteConfig({
+    configFile,
+    mode,
+    root,
+    plugins: [
+      {
+        name: "react-router:extract-vite-user-config",
+        config(config) {
+          viteUserConfig = config;
+        }
+      }
+    ]
+  });
+  let ctx = await extractPluginContext(viteConfig);
   if (!ctx) {
     console.error(
       import_picocolors5.default.red("React Router Vite plugin not found in Vite config")
     );
     process.exit(1);
   }
-  let { reactRouterConfig } = ctx;
-  let vite2 = getVite();
-  async function viteBuild(environmentOptionsResolvers2, environmentName) {
+  async function buildEnvironment(environmentName) {
+    let vite2 = getVite();
     let ssr = environmentName !== "client";
-    let resolveOptions = environmentOptionsResolvers2[environmentName];
-    invariant(
-      resolveOptions,
-      `Missing environment options resolver for ${environmentName}`
-    );
+    let resolveOptions = environmentOptionsResolvers[environmentName];
+    invariant(resolveOptions);
     let environmentBuildContext = {
       name: environmentName,
       resolveOptions
@@ -1390,49 +1605,37 @@ async function build(root, {
       ...{ __reactRouterEnvironmentBuildContext: environmentBuildContext }
     });
   }
-  await cleanBuildDirectory(viteConfig, ctx);
+  let { reactRouterConfig } = ctx;
   let buildManifest = await getBuildManifest(ctx);
   let environmentOptionsResolvers = await getEnvironmentOptionsResolvers(
     ctx,
-    buildManifest
+    buildManifest,
+    "build"
   );
-  await viteBuild(environmentOptionsResolvers, "client");
-  let serverEnvironmentNames = Object.keys(
-    environmentOptionsResolvers
-  ).filter((environmentName) => environmentName !== "client");
-  await Promise.all(
-    serverEnvironmentNames.map(
-      (environmentName) => viteBuild(environmentOptionsResolvers, environmentName)
-    )
+  let environmentsOptions = resolveEnvironmentsOptions(
+    environmentOptionsResolvers,
+    { viteUserConfig }
   );
-  let viteManifestPaths = getViteManifestPaths(environmentOptionsResolvers);
-  await Promise.all(
-    viteManifestPaths.map(async (viteManifestPath) => {
-      let manifestExists = await import_fs_extra.default.pathExists(viteManifestPath);
-      if (!manifestExists) return;
-      if (!ctx.viteManifestEnabled) {
-        await import_fs_extra.default.remove(viteManifestPath);
-      }
-      let viteDir = import_node_path2.default.dirname(viteManifestPath);
-      let viteDirFiles = await import_fs_extra.default.readdir(viteDir);
-      if (viteDirFiles.length === 0) {
-        await import_fs_extra.default.remove(viteDir);
-      }
-    })
+  await cleanBuildDirectory(viteConfig, ctx);
+  await buildEnvironment("client");
+  let serverEnvironmentNames = getServerEnvironmentKeys(
+    environmentOptionsResolvers,
+    buildManifest
   );
+  await Promise.all(serverEnvironmentNames.map(buildEnvironment));
+  await cleanViteManifests(environmentsOptions, ctx);
   await reactRouterConfig.buildEnd?.({
     buildManifest,
     reactRouterConfig,
     viteConfig
   });
 }
-var import_node_path2, import_fs_extra, import_picocolors5;
+var import_picocolors5;
 var init_build = __esm({
   "vite/build.ts"() {
     "use strict";
-    import_node_path2 = __toESM(require("path"));
-    import_fs_extra = __toESM(require("fs-extra"));
     import_picocolors5 = __toESM(require("picocolors"));
+    init_config();
     init_plugin();
     init_invariant();
     init_vite();
@@ -1508,8 +1711,8 @@ var import_semver = __toESM(require("semver"));
 var import_picocolors8 = __toESM(require("picocolors"));
 
 // cli/commands.ts
-var path9 = __toESM(require("path"));
-var import_fs_extra2 = __toESM(require("fs-extra"));
+var path8 = __toESM(require("path"));
+var import_fs_extra = __toESM(require("fs-extra"));
 var import_package_json2 = __toESM(require("@npmcli/package-json"));
 var import_exit_hook = __toESM(require("exit-hook"));
 var import_picocolors7 = __toESM(require("picocolors"));
@@ -1662,14 +1865,14 @@ async function generateEntry(entry, reactRouterRoot, flags = {}) {
     console.error(import_picocolors7.default.red(`No default server entry detected.`));
     return;
   }
-  let defaultsDirectory = path9.resolve(
-    path9.dirname(require.resolve("@react-router/dev/package.json")),
+  let defaultsDirectory = path8.resolve(
+    path8.dirname(require.resolve("@react-router/dev/package.json")),
     "dist",
     "config",
     "defaults"
   );
-  let defaultEntryClient = path9.resolve(defaultsDirectory, "entry.client.tsx");
-  let defaultEntryServer = path9.resolve(
+  let defaultEntryClient = path8.resolve(defaultsDirectory, "entry.client.tsx");
+  let defaultEntryServer = path8.resolve(
     defaultsDirectory,
     `entry.server.node.tsx`
   );
@@ -1678,19 +1881,19 @@ async function generateEntry(entry, reactRouterRoot, flags = {}) {
   let useTypeScript = flags.typescript ?? true;
   let outputExtension = useTypeScript ? "tsx" : "jsx";
   let outputEntry = `${entry}.${outputExtension}`;
-  let outputFile2 = path9.resolve(appDirectory, outputEntry);
+  let outputFile2 = path8.resolve(appDirectory, outputEntry);
   if (!useTypeScript) {
     let javascript = transpile(contents, {
       cwd: rootDirectory,
       filename: isServerEntry ? defaultEntryServer : defaultEntryClient
     });
-    await import_fs_extra2.default.writeFile(outputFile2, javascript, "utf-8");
+    await import_fs_extra.default.writeFile(outputFile2, javascript, "utf-8");
   } else {
-    await import_fs_extra2.default.writeFile(outputFile2, contents, "utf-8");
+    await import_fs_extra.default.writeFile(outputFile2, contents, "utf-8");
   }
   console.log(
     import_picocolors7.default.blue(
-      `Entry file ${entry} created at ${path9.relative(
+      `Entry file ${entry} created at ${path8.relative(
         rootDirectory,
         outputFile2
       )}.`
@@ -1699,10 +1902,10 @@ async function generateEntry(entry, reactRouterRoot, flags = {}) {
 }
 async function checkForEntry(rootDirectory, appDirectory, entries2) {
   for (let entry of entries2) {
-    let entryPath = path9.resolve(appDirectory, entry);
-    let exists = await import_fs_extra2.default.pathExists(entryPath);
+    let entryPath = path8.resolve(appDirectory, entry);
+    let exists = await import_fs_extra.default.pathExists(entryPath);
     if (exists) {
-      let relative8 = path9.relative(rootDirectory, entryPath);
+      let relative8 = path8.relative(rootDirectory, entryPath);
       console.error(import_picocolors7.default.red(`Entry file ${relative8} already exists.`));
       return process.exit(1);
     }
@@ -1710,12 +1913,12 @@ async function checkForEntry(rootDirectory, appDirectory, entries2) {
 }
 async function createServerEntry(rootDirectory, appDirectory, inputFile) {
   await checkForEntry(rootDirectory, appDirectory, serverEntries);
-  let contents = await import_fs_extra2.default.readFile(inputFile, "utf-8");
+  let contents = await import_fs_extra.default.readFile(inputFile, "utf-8");
   return contents;
 }
 async function createClientEntry(rootDirectory, appDirectory, inputFile) {
   await checkForEntry(rootDirectory, appDirectory, clientEntries);
-  let contents = await import_fs_extra2.default.readFile(inputFile, "utf-8");
+  let contents = await import_fs_extra.default.readFile(inputFile, "utf-8");
   return contents;
 }
 async function typegen(root, flags) {