@vercel/microfrontends 1.0.1-canary.2 → 1.0.1-canary.4

package/dist/experimental/vite.js

@@ -1,11 +1,6 @@
-// src/vite/index.ts
-import { existsSync } from "node:fs";
-import { join as join3 } from "node:path";
-import { cwd } from "node:process";
-
 // src/config/microfrontends/server/index.ts
-import fs5 from "node:fs";
-import { dirname as dirname3, join as join2 } from "node:path";
+import fs6 from "node:fs";
+import { dirname as dirname3 } from "node:path";
 
 // src/config/overrides/constants.ts
 var OVERRIDES_COOKIE_PREFIX = "vercel-micro-frontends-override";
@@ -188,21 +183,21 @@ var MicrofrontendConfigClient = class {
   isEqual(other) {
     return JSON.stringify(this.applications) === JSON.stringify(other.applications);
   }
-  getApplicationNameForPath(path5) {
-    if (!path5.startsWith("/")) {
+  getApplicationNameForPath(path6) {
+    if (!path6.startsWith("/")) {
       throw new Error(`Path must start with a /`);
     }
-    if (this.pathCache[path5]) {
-      return this.pathCache[path5];
+    if (this.pathCache[path6]) {
+      return this.pathCache[path6];
     }
-    const pathname = new URL(path5, "https://example.com").pathname;
+    const pathname = new URL(path6, "https://example.com").pathname;
     for (const [name, application] of Object.entries(this.applications)) {
       if (application.routing) {
         for (const group of application.routing) {
           for (const childPath of group.paths) {
             const regexp = pathToRegexp(childPath);
             if (regexp.test(pathname)) {
-              this.pathCache[path5] = name;
+              this.pathCache[path6] = name;
               return name;
             }
           }
@@ -215,7 +210,7 @@ var MicrofrontendConfigClient = class {
     if (!defaultApplication) {
       return null;
     }
-    this.pathCache[path5] = defaultApplication[0];
+    this.pathCache[path6] = defaultApplication[0];
     return defaultApplication[0];
   }
   serialize() {
@@ -237,18 +232,18 @@ var validateConfigPaths = (applicationConfigsById) => {
     }
     const childApp = app;
     for (const pathMatch of childApp.routing) {
-      for (const path5 of pathMatch.paths) {
-        const maybeError = validatePathExpression(path5);
+      for (const path6 of pathMatch.paths) {
+        const maybeError = validatePathExpression(path6);
         if (maybeError) {
           errors.push(maybeError);
         } else {
-          const existing = pathsByApplicationId.get(path5);
+          const existing = pathsByApplicationId.get(path6);
           if (existing) {
             existing.applications.push(id);
           } else {
-            pathsByApplicationId.set(path5, {
+            pathsByApplicationId.set(path6, {
               applications: [id],
-              matcher: pathToRegexp2(path5),
+              matcher: pathToRegexp2(path6),
               applicationId: id
             });
           }
@@ -257,24 +252,24 @@ var validateConfigPaths = (applicationConfigsById) => {
     }
   }
   const entries = Array.from(pathsByApplicationId.entries());
-  for (const [path5, { applications: ids, matcher, applicationId }] of entries) {
+  for (const [path6, { applications: ids, matcher, applicationId }] of entries) {
     if (ids.length > 1) {
       errors.push(
-        `Duplicate path "${path5}" for applications "${ids.join(", ")}"`
+        `Duplicate path "${path6}" for applications "${ids.join(", ")}"`
       );
     }
     for (const [
       matchPath,
       { applications: matchIds, applicationId: matchApplicationId }
     ] of entries) {
-      if (path5 === matchPath) {
+      if (path6 === matchPath) {
         continue;
       }
       if (applicationId === matchApplicationId) {
         continue;
       }
       if (matcher.test(matchPath)) {
-        const source = `"${path5}" of application${ids.length > 0 ? "s" : ""} ${ids.join(", ")}`;
+        const source = `"${path6}" of application${ids.length > 0 ? "s" : ""} ${ids.join(", ")}`;
         const destination = `"${matchPath}" of application${matchIds.length > 0 ? "s" : ""} ${matchIds.join(", ")}`;
         errors.push(
           `Overlapping path detected between ${source} and ${destination}`
@@ -290,39 +285,42 @@ var validateConfigPaths = (applicationConfigsById) => {
   }
 };
 var PATH_DEFAULT_PATTERN = "[^\\/#\\?]+?";
-function validatePathExpression(path5) {
+function validatePathExpression(path6) {
   try {
-    const tokens = parsePathRegexp(path5);
-    if (/(?<!\\)\{/.test(path5)) {
-      return `Optional paths are not supported: ${path5}`;
+    const tokens = parsePathRegexp(path6);
+    if (/(?<!\\)\{/.test(path6)) {
+      return `Optional paths are not supported: ${path6}`;
     }
-    if (/(?<!\\|\()\?/.test(path5)) {
-      return `Optional paths are not supported: ${path5}`;
+    if (/(?<!\\|\()\?/.test(path6)) {
+      return `Optional paths are not supported: ${path6}`;
     }
-    if (/\/[^/]*(?<!\\):[^/]*(?<!\\):[^/]*/.test(path5)) {
-      return `Only one wildcard is allowed per path segment: ${path5}`;
+    if (/\/[^/]*(?<!\\):[^/]*(?<!\\):[^/]*/.test(path6)) {
+      return `Only one wildcard is allowed per path segment: ${path6}`;
     }
     for (let i = 0; i < tokens.length; i++) {
       const token = tokens[i];
       if (token === void 0) {
-        return `token ${i} in ${path5} is undefined, this shouldn't happen`;
+        return `token ${i} in ${path6} is undefined, this shouldn't happen`;
       }
       if (typeof token !== "string") {
+        if (!token.name) {
+          return `Only named wildcards are allowed: ${path6} (hint: add ":path" to the wildcard)`;
+        }
         if (token.pattern !== PATH_DEFAULT_PATTERN && // Allows (a|b|c) and ((?!a|b|c).*) regex
         // Only limited regex is supported for now, due to performance considerations
         !/^(?<allowed>[\w]+(?:\|[^|()]+)+)$|^\(\?!(?<disallowed>[\w]+(?:\|[^|()]+)+)\)\.\*$/.test(
           token.pattern
         )) {
-          return `Path ${path5} cannot use unsupported regular expression wildcard`;
+          return `Path ${path6} cannot use unsupported regular expression wildcard`;
         }
         if (token.modifier && i !== tokens.length - 1) {
-          return `Modifier ${token.modifier} is not allowed on wildcard :${token.name} in ${path5}. Modifiers are only allowed in the last path component`;
+          return `Modifier ${token.modifier} is not allowed on wildcard :${token.name} in ${path6}. Modifiers are only allowed in the last path component`;
         }
       }
     }
   } catch (e) {
     const message = e instanceof Error ? e.message : String(e);
-    return `Path ${path5} could not be parsed into regexp: ${message}`;
+    return `Path ${path6} could not be parsed into regexp: ${message}`;
   }
   return void 0;
 }
@@ -676,12 +674,8 @@ var MicrofrontendConfigIsomorphic = class {
     const skipValidation = opts?.skipValidation ?? [];
     const c = typeof config === "string" ? parse(config) : config;
     if (isMainConfig(c)) {
-      if (!skipValidation.includes("paths")) {
-        validateConfigPaths(c.applications);
-      }
-      if (!skipValidation.includes("defaultApplication")) {
-        validateConfigDefaultApplication(c.applications);
-      }
+      validateConfigPaths(c.applications);
+      validateConfigDefaultApplication(c.applications);
       if (!skipValidation.includes("deprecatedFields")) {
         validateDeprecatedFields(c);
       }
@@ -1038,6 +1032,9 @@ function isMonorepo({
     if (fs2.existsSync(path2.join(repositoryRoot, "vlt-workspaces.json"))) {
       return true;
     }
+    if (process.env.NX_WORKSPACE_ROOT === path2.resolve(repositoryRoot)) {
+      return true;
+    }
     const packageJsonPath = path2.join(repositoryRoot, "package.json");
     if (!fs2.existsSync(packageJsonPath)) {
       return false;
@@ -1083,8 +1080,42 @@ function findConfig({ dir }) {
   return null;
 }
 
-// src/config/microfrontends/server/utils/get-output-file-path.ts
+// src/config/microfrontends/utils/get-application-context.ts
+import fs5 from "node:fs";
 import path4 from "node:path";
+function getApplicationContext(opts) {
+  if (opts?.appName) {
+    return { name: opts.appName };
+  }
+  if (process.env.NX_TASK_TARGET_PROJECT) {
+    return { name: process.env.NX_TASK_TARGET_PROJECT };
+  }
+  try {
+    const packageJsonString = fs5.readFileSync(
+      path4.join(opts?.packageRoot || ".", "package.json"),
+      "utf-8"
+    );
+    const packageJson = JSON.parse(packageJsonString);
+    if (!packageJson.name) {
+      throw new MicrofrontendError(
+        `package.json file missing required field "name"`,
+        {
+          type: "packageJson",
+          subtype: "missing_field_name",
+          source: "@vercel/microfrontends/next"
+        }
+      );
+    }
+    return { name: packageJson.name };
+  } catch (err) {
+    throw MicrofrontendError.handle(err, {
+      fileName: "package.json"
+    });
+  }
+}
+
+// src/config/microfrontends/server/utils/get-output-file-path.ts
+import path5 from "node:path";
 
 // src/config/microfrontends/server/constants.ts
 var MFE_CONFIG_DEFAULT_FILE_PATH = "microfrontends";
@@ -1092,7 +1123,7 @@ var MFE_CONFIG_DEFAULT_FILE_NAME = "microfrontends.json";
 
 // src/config/microfrontends/server/utils/get-output-file-path.ts
 function getOutputFilePath() {
-  return path4.join(MFE_CONFIG_DEFAULT_FILE_PATH, MFE_CONFIG_DEFAULT_FILE_NAME);
+  return path5.join(MFE_CONFIG_DEFAULT_FILE_PATH, MFE_CONFIG_DEFAULT_FILE_NAME);
 }
 
 // src/config/microfrontends/server/validation.ts
@@ -1431,8 +1462,8 @@ var MicrofrontendsServer = class extends Microfrontends {
     pretty: true
   }) {
     const outputPath = getOutputFilePath();
-    fs5.mkdirSync(dirname3(outputPath), { recursive: true });
-    fs5.writeFileSync(
+    fs6.mkdirSync(dirname3(outputPath), { recursive: true });
+    fs6.writeFileSync(
       outputPath,
       JSON.stringify(
         this.config.toSchemaJson(),
@@ -1518,14 +1549,8 @@ var MicrofrontendsServer = class extends Microfrontends {
     }
     try {
       const packageRoot = findPackageRoot(directory);
-      const packageJsonPath = join2(packageRoot, "package.json");
-      const packageJson = JSON.parse(
-        fs5.readFileSync(packageJsonPath, "utf-8")
-      );
-      if (!packageJson.name) {
-        throw new Error(`No name found in package.json at ${packageJsonPath}`);
-      }
-      const configMeta = meta ?? { fromApp: packageJson.name };
+      const { name: appName } = getApplicationContext({ packageRoot });
+      const configMeta = meta ?? { fromApp: appName };
       const maybeConfig = findConfig({ dir: packageRoot });
       if (maybeConfig) {
         return MicrofrontendsServer.fromFile({
@@ -1540,7 +1565,7 @@ var MicrofrontendsServer = class extends Microfrontends {
       if (isMonorepo2) {
         const defaultPackage = findDefaultMicrofrontendsPackage({
           repositoryRoot,
-          applicationName: packageJson.name
+          applicationName: appName
         });
         const maybeConfigFromDefault = findConfig({ dir: defaultPackage });
         if (maybeConfigFromDefault) {
@@ -1570,7 +1595,7 @@ var MicrofrontendsServer = class extends Microfrontends {
     options
   }) {
     try {
-      const configJson = fs5.readFileSync(filePath, "utf-8");
+      const configJson = fs6.readFileSync(filePath, "utf-8");
       const config = MicrofrontendsServer.validate(configJson);
       if (!isMainConfig(config) && options?.resolveMainConfig) {
         const repositoryRoot = findRepositoryRoot();
@@ -1618,7 +1643,7 @@ var MicrofrontendsServer = class extends Microfrontends {
     overrides
   }) {
     try {
-      const config = fs5.readFileSync(filePath, "utf-8");
+      const config = fs6.readFileSync(filePath, "utf-8");
       const validatedConfig = MicrofrontendsServer.validate(config);
       if (!isMainConfig(validatedConfig)) {
         throw new MicrofrontendError(
@@ -1649,31 +1674,18 @@ var MicrofrontendsServer = class extends Microfrontends {
   }
 };
 
-// src/config/microfrontends/utils/get-application-context.ts
-import fs6 from "node:fs";
-function getApplicationContext(opts) {
-  if (opts?.appName) {
-    return { name: opts.appName };
+// src/vite/detect-framework.ts
+import { existsSync } from "node:fs";
+import { join as join2 } from "node:path";
+import { cwd } from "node:process";
+function detectFramework() {
+  if (existsSync(join2(cwd(), "svelte.config.js"))) {
+    return "sveltekit";
   }
-  try {
-    const packageJsonString = fs6.readFileSync("./package.json", "utf-8");
-    const packageJson = JSON.parse(packageJsonString);
-    if (!packageJson.name) {
-      throw new MicrofrontendError(
-        `package.json file missing required field "name"`,
-        {
-          type: "packageJson",
-          subtype: "missing_field_name",
-          source: "@vercel/microfrontends/next"
-        }
-      );
-    }
-    return { name: packageJson.name };
-  } catch (err) {
-    throw MicrofrontendError.handle(err, {
-      fileName: "package.json"
-    });
+  if (existsSync(join2(cwd(), "react-router.config.js")) || existsSync(join2(cwd(), "react-router.config.ts"))) {
+    return "react-router";
   }
+  return "unknown";
 }
 
 // src/vite/index.ts
@@ -1685,23 +1697,45 @@ function microfrontends(opts) {
     }
   });
   const app = microfrontendsObj.config.getApplication(fromApp);
+  if (app.isDefault() && opts?.basePath) {
+    throw new Error(
+      "`basePath` can not be set for the default microfrontends application."
+    );
+  }
+  if (opts?.basePath && !opts.basePath.startsWith("/")) {
+    throw new Error("`basePath` must start with a `/`");
+  }
   const additionalConfigOptions = {};
+  const framework = detectFramework();
   if (!app.isDefault()) {
     if (opts?.basePath) {
-      additionalConfigOptions.base = `/${opts.basePath}`;
-    } else {
-      const isSvelteKit = existsSync(join3(cwd(), "svelte.config.js"));
-      if (!isSvelteKit) {
-        additionalConfigOptions.experimental = {
-          renderBuiltUrl(filename, { type }) {
-            if (type === "asset") {
-              return `/${app.getAssetPrefix()}/${filename}`;
-            }
-          }
-        };
+      if (framework !== "react-router" || !process.env.VERCEL_ENV) {
+        let basePath = opts.basePath;
+        if (process.env.NODE_ENV === "production" && !basePath.endsWith("/")) {
+          basePath = `${basePath}/`;
+        }
+        additionalConfigOptions.base = basePath;
       }
+    } else if (framework !== "sveltekit") {
+      additionalConfigOptions.experimental = {
+        renderBuiltUrl(filename, { type }) {
+          if (type === "asset") {
+            return `/${app.getAssetPrefix()}/${filename}`;
+          }
+        }
+      };
+    }
+    if (framework === "react-router") {
+      additionalConfigOptions.build = {
+        assetsDir: `./${opts?.basePath ?? app.getAssetPrefix()}`
+      };
     }
   }
+  if (app.development.local.port) {
+    additionalConfigOptions.server = {
+      port: app.development.local.port
+    };
+  }
   return {
     name: "vite-plugin-vercel-microfrontends",
     config: () => {