@vercel/microfrontends 2.1.2 → 2.2.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (48) hide show
  1. package/CHANGELOG.md +20 -0
  2. package/README.md +4 -0
  3. package/dist/bin/cli.cjs +125 -89
  4. package/dist/config.d.ts +2 -2
  5. package/dist/experimental/sveltekit.cjs +97 -62
  6. package/dist/experimental/sveltekit.cjs.map +1 -1
  7. package/dist/experimental/sveltekit.d.ts +6 -0
  8. package/dist/experimental/sveltekit.js +97 -62
  9. package/dist/experimental/sveltekit.js.map +1 -1
  10. package/dist/experimental/vite.cjs +96 -65
  11. package/dist/experimental/vite.cjs.map +1 -1
  12. package/dist/experimental/vite.js +96 -65
  13. package/dist/experimental/vite.js.map +1 -1
  14. package/dist/microfrontends/server.cjs +92 -59
  15. package/dist/microfrontends/server.cjs.map +1 -1
  16. package/dist/microfrontends/server.d.ts +2 -2
  17. package/dist/microfrontends/server.js +92 -59
  18. package/dist/microfrontends/server.js.map +1 -1
  19. package/dist/microfrontends/utils.cjs +3 -3
  20. package/dist/microfrontends/utils.cjs.map +1 -1
  21. package/dist/microfrontends/utils.d.ts +1 -1
  22. package/dist/microfrontends/utils.js +3 -3
  23. package/dist/microfrontends/utils.js.map +1 -1
  24. package/dist/next/config.cjs +133 -115
  25. package/dist/next/config.cjs.map +1 -1
  26. package/dist/next/config.d.ts +11 -1
  27. package/dist/next/config.js +133 -115
  28. package/dist/next/config.js.map +1 -1
  29. package/dist/next/middleware.cjs +35 -17
  30. package/dist/next/middleware.cjs.map +1 -1
  31. package/dist/next/middleware.js +35 -17
  32. package/dist/next/middleware.js.map +1 -1
  33. package/dist/next/testing.d.ts +2 -2
  34. package/dist/overrides.d.ts +3 -3
  35. package/dist/schema.d.ts +2 -2
  36. package/dist/{types-88602303.d.ts → types-b9ea41b2.d.ts} +1 -1
  37. package/dist/{types-e7523e61.d.ts → types-dcd8b17a.d.ts} +71 -24
  38. package/dist/utils/mfe-port.cjs +92 -59
  39. package/dist/utils/mfe-port.cjs.map +1 -1
  40. package/dist/utils/mfe-port.js +92 -59
  41. package/dist/utils/mfe-port.js.map +1 -1
  42. package/dist/validation.cjs +47 -38
  43. package/dist/validation.cjs.map +1 -1
  44. package/dist/validation.d.ts +1 -1
  45. package/dist/validation.js +47 -38
  46. package/dist/validation.js.map +1 -1
  47. package/package.json +1 -1
  48. package/schema/schema.json +47 -38
@@ -1,9 +1,35 @@
1
+ // src/bin/local-proxy-is-running.ts
2
+ function localProxyIsRunning() {
3
+ return process.env.TURBO_TASK_HAS_MFE_PROXY === "true";
4
+ }
5
+
6
+ // src/bin/logger.ts
7
+ function debug(...args) {
8
+ if (process.env.MFE_DEBUG) {
9
+ console.log(...args);
10
+ }
11
+ }
12
+ function info(...args) {
13
+ console.log(...args);
14
+ }
15
+ function warn(...args) {
16
+ console.warn(...args);
17
+ }
18
+ function error(...args) {
19
+ console.error(...args);
20
+ }
21
+ var logger = {
22
+ debug,
23
+ info,
24
+ warn,
25
+ error
26
+ };
27
+
1
28
  // src/bin/check-proxy.ts
2
29
  function displayLocalProxyInfo(port) {
3
- const { MFE_PROXY_MESSAGE_PRINTED, TURBO_TASK_HAS_MFE_PROXY } = process.env;
4
- if (TURBO_TASK_HAS_MFE_PROXY === "true" && MFE_PROXY_MESSAGE_PRINTED !== "true") {
30
+ if (localProxyIsRunning() && process.env.MFE_PROXY_MESSAGE_PRINTED !== "true") {
5
31
  process.env.MFE_PROXY_MESSAGE_PRINTED = "true";
6
- console.log(`Microfrontends Proxy running on http://localhost:${port}`);
32
+ logger.info(`Microfrontends Proxy running on http://localhost:${port}`);
7
33
  }
8
34
  }
9
35
 
@@ -198,8 +224,8 @@ import fg from "fast-glob";
198
224
 
199
225
  // src/config/microfrontends/utils/get-config-file-name.ts
200
226
  var DEFAULT_CONFIGURATION_FILENAMES = [
201
- "microfrontends.jsonc",
202
- "microfrontends.json"
227
+ "microfrontends.json",
228
+ "microfrontends.jsonc"
203
229
  ];
204
230
  function getPossibleConfigurationFilenames({
205
231
  customConfigFilename
@@ -207,7 +233,7 @@ function getPossibleConfigurationFilenames({
207
233
  if (customConfigFilename) {
208
234
  if (!customConfigFilename.endsWith(".json") && !customConfigFilename.endsWith(".jsonc")) {
209
235
  throw new Error(
210
- `The VC_MICROFRONTENDS_CONFIG_FILE_NAME environment variable must end with '.json' or '.jsonc'. Received: ${customConfigFilename}`
236
+ `Found VC_MICROFRONTENDS_CONFIG_FILE_NAME but the name is invalid. Received: ${customConfigFilename}. The file name must end with '.json' or '.jsonc'. It's also possible for the env var to include the path, eg microfrontends-dev.json or /path/to/microfrontends-dev.json.`
211
237
  );
212
238
  }
213
239
  return Array.from(
@@ -255,7 +281,7 @@ function findPackageWithMicrofrontendsConfig({
255
281
  }
256
282
  }
257
283
  }
258
- } catch (error) {
284
+ } catch (error2) {
259
285
  }
260
286
  }
261
287
  if (matchingPaths.length > 1) {
@@ -291,9 +317,9 @@ If you suspect this is thrown in error, please reach out to the Vercel team.`,
291
317
  }
292
318
  const [packageJsonPath] = matchingPaths;
293
319
  return dirname(packageJsonPath);
294
- } catch (error) {
295
- if (error instanceof MicrofrontendError) {
296
- throw error;
320
+ } catch (error2) {
321
+ if (error2 instanceof MicrofrontendError) {
322
+ throw error2;
297
323
  }
298
324
  return null;
299
325
  }
@@ -338,8 +364,8 @@ function isMonorepo({
338
364
  fs2.readFileSync(packageJsonPath, "utf-8")
339
365
  );
340
366
  return packageJson.workspaces !== void 0;
341
- } catch (error) {
342
- console.error("Error determining if repository is a monorepo", error);
367
+ } catch (error2) {
368
+ logger.error("Error determining if repository is a monorepo", error2);
343
369
  return false;
344
370
  }
345
371
  }
@@ -1133,38 +1159,28 @@ var schema_default = {
1133
1159
  type: "object",
1134
1160
  properties: {
1135
1161
  $schema: {
1136
- type: "string"
1162
+ type: "string",
1163
+ description: "See https://openapi.vercel.sh/microfrontends.json."
1137
1164
  },
1138
1165
  version: {
1139
1166
  type: "string",
1140
- const: "1"
1141
- },
1142
- options: {
1143
- $ref: "#/definitions/Options"
1167
+ const: "1",
1168
+ description: "The version of the microfrontends config schema."
1144
1169
  },
1145
1170
  applications: {
1146
1171
  $ref: "#/definitions/ApplicationRouting",
1147
- description: "Mapping of application names to the routes that they host. Only needs to be defined in the application that owns the primary microfrontend domain"
1172
+ description: "Mapping of Vercel project names to their microfrontend configurations."
1173
+ },
1174
+ options: {
1175
+ $ref: "#/definitions/Options",
1176
+ description: "Optional configuration options for the microfrontend."
1148
1177
  }
1149
1178
  },
1150
1179
  required: [
1151
1180
  "applications"
1152
1181
  ],
1153
- additionalProperties: false
1154
- },
1155
- Options: {
1156
- type: "object",
1157
- properties: {
1158
- disableOverrides: {
1159
- type: "boolean",
1160
- description: "If you want to disable the overrides for the site. For example, if you are managing rewrites between applications externally, you may wish to disable the overrides on the toolbar as they will have no effect."
1161
- },
1162
- localProxyPort: {
1163
- type: "number",
1164
- description: "The port number used by the local proxy server.\n\nThe default is `3024`."
1165
- }
1166
- },
1167
- additionalProperties: false
1182
+ additionalProperties: false,
1183
+ description: "The microfrontends configuration schema. See https://vercel.com/docs/microfrontends/configuration."
1168
1184
  },
1169
1185
  ApplicationRouting: {
1170
1186
  type: "object",
@@ -1172,8 +1188,9 @@ var schema_default = {
1172
1188
  $ref: "#/definitions/Application"
1173
1189
  },
1174
1190
  propertyNames: {
1175
- description: "The unique identifier for a Microfrontend Application.\n\nMust match the Vercel project name.\n\nNote: If this name does not also match the name used to run the application, (e.g. the `name` from the `package.json`), then the `packageName` field should be set."
1176
- }
1191
+ description: "The Vercel project name of the microfrontend application.\n\nNote: If this name does not also match the name `name` from the `package.json`, set `packageName` with the name used in `package.json`.\n\nSee https://vercel.com/docs/microfrontends/configuration#application-naming."
1192
+ },
1193
+ description: "Mapping of Vercel project names to their microfrontend configurations."
1177
1194
  },
1178
1195
  Application: {
1179
1196
  anyOf: [
@@ -1183,14 +1200,15 @@ var schema_default = {
1183
1200
  {
1184
1201
  $ref: "#/definitions/ChildApplication"
1185
1202
  }
1186
- ]
1203
+ ],
1204
+ description: "The configuration for a microfrontend application. There must always be one default application."
1187
1205
  },
1188
1206
  DefaultApplication: {
1189
1207
  type: "object",
1190
1208
  properties: {
1191
1209
  packageName: {
1192
1210
  type: "string",
1193
- description: "The name used to run the application, e.g. the `name` field in the `package.json`.\n\nThis is used by the local proxy to map the application config to the locally running app.\n\nThis is only necessary when the application name does not match the `name` used in `package.json`."
1211
+ description: "The name used to run the application, e.g. the `name` field in the `package.json`.\n\nThis is used by the local proxy to map the application config to the locally running app.\n\nThis is only necessary when the application name does not match the `name` used in `package.json`.\n\nSee https://vercel.com/docs/microfrontends/configuration#application-naming."
1194
1212
  },
1195
1213
  development: {
1196
1214
  $ref: "#/definitions/DefaultDevelopment",
@@ -1210,15 +1228,15 @@ var schema_default = {
1210
1228
  "number",
1211
1229
  "string"
1212
1230
  ],
1213
- description: "A local port number or host string that this application runs on when it is running locally. If passing a string, include the protocol (optional), host (required) and port (optional). For example: `https://this.ismyhost:8080`. If omitted, the protocol defaults to HTTP. If omitted, the port defaults to a unique, but stable (based on the application name) number.\n\nExamples of valid values:\n- 8080\n- my.localhost.me\n- my.localhost.me:8080\n- https://my.localhost.me\n- https://my.localhost.me:8080"
1231
+ description: "A local port number or host that this application runs on when it is running locally. If passing a string, include the protocol (optional), host (required) and port (optional).\n\nExamples of valid values: 8080, my.localhost.me, my.localhost.me:8080, https://my.localhost.me, https://my.localhost.me:8080.\n\nThe default value is http://localhost:<port> where port is a stable, unique port number (based on the application name).\n\nSee https://vercel.com/docs/microfrontends/local-development."
1214
1232
  },
1215
1233
  task: {
1216
1234
  type: "string",
1217
- description: "Optional task to run when starting the development server. Should reference a script in the package.json of the application."
1235
+ description: 'The task to run when starting the development server. Should reference a script in the package.json of the application.\n\nThe default value is "dev".\n\nSee https://vercel.com/docs/microfrontends/local-development.'
1218
1236
  },
1219
1237
  fallback: {
1220
1238
  type: "string",
1221
- description: "Fallback for local development, could point to any environment. This is required for the default app. This value is used as the fallback for child apps as well if they do not have a fallback.\n\nIf passing a string, include the protocol (optional), host (required) and port (optional). For example: `https://this.ismyhost:8080`. If omitted, the protocol defaults to HTTPS. If omitted, the port defaults to `80` for HTTP and `443` for HTTPS."
1239
+ description: "Fallback for local development, could point to any environment. This is required for the default app. This value is used as the fallback for child apps as well if they do not have a fallback.\n\nIf passing a string, include the protocol (optional), host (required) and port (optional). For example: `https://this.ismyhost:8080`. If omitted, the protocol defaults to HTTPS. If omitted, the port defaults to `80` for HTTP and `443` for HTTPS.\n\nSee https://vercel.com/docs/microfrontends/local-development."
1222
1240
  }
1223
1241
  },
1224
1242
  required: [
@@ -1231,7 +1249,7 @@ var schema_default = {
1231
1249
  properties: {
1232
1250
  packageName: {
1233
1251
  type: "string",
1234
- description: "The name used to run the application, e.g. the `name` field in the `package.json`.\n\nThis is used by the local proxy to map the application config to the locally running app.\n\nThis is only necessary when the application name does not match the `name` used in `package.json`."
1252
+ description: "The name used to run the application, e.g. the `name` field in the `package.json`.\n\nThis is used by the local proxy to map the application config to the locally running app.\n\nThis is only necessary when the application name does not match the `name` used in `package.json`.\n\nSee https://vercel.com/docs/microfrontends/configuration#application-naming."
1235
1253
  },
1236
1254
  development: {
1237
1255
  $ref: "#/definitions/ChildDevelopment",
@@ -1239,11 +1257,11 @@ var schema_default = {
1239
1257
  },
1240
1258
  routing: {
1241
1259
  $ref: "#/definitions/Routing",
1242
- description: "Groups of path expressions that are routed to this application."
1260
+ description: "Groups of path expressions that are routed to this application.\n\nSee https://vercel.com/docs/microfrontends/path-routing."
1243
1261
  },
1244
1262
  assetPrefix: {
1245
1263
  type: "string",
1246
- description: "The name of the asset prefix to use instead of the auto-generated name.\n\nThe asset prefix is used to prefix all paths to static assets, such as JS, CSS, or images that are served by a specific application. It is necessary to ensure there are no conflicts with other applications on the same domain.\n\nAn auto-generated asset prefix of the form `vc-ap-<hash>` is used when this field is not provided.\n\nWhen this field is provided, `/${assetPrefix}/:path*` must also be added to the list of paths in the `routing` field. Changing the asset prefix after a microfrontend application has already been deployed is not a forwards and backwards compatible change, and the asset prefix should be added to the `routing` field and deployed before setting the `assetPrefix` field."
1264
+ description: "The name of the asset prefix to use instead of the auto-generated name.\n\nThe asset prefix is used to prefix all paths to static assets, such as JS, CSS, or images that are served by a specific application. It is necessary to ensure there are no conflicts with other applications on the same domain.\n\nAn auto-generated asset prefix of the form `vc-ap-<hash>` is used when this field is not provided.\n\nWhen this field is provided, `/${assetPrefix}/:path*` must also be added to the list of paths in the `routing` field. Changing the asset prefix after a microfrontend application has already been deployed is not a forwards and backwards compatible change, and the asset prefix should be added to the `routing` field and deployed before setting the `assetPrefix` field.\n\nThe default value is the auto-generated asset prefix of the form `vc-ap-<hash>`.\n\nSee https://vercel.com/docs/microfrontends/path-routing#asset-prefix."
1247
1265
  }
1248
1266
  },
1249
1267
  required: [
@@ -1259,15 +1277,15 @@ var schema_default = {
1259
1277
  "number",
1260
1278
  "string"
1261
1279
  ],
1262
- description: "A local port number or host string that this application runs on when it is running locally. If passing a string, include the protocol (optional), host (required) and port (optional). For example: `https://this.ismyhost:8080`. If omitted, the protocol defaults to HTTP. If omitted, the port defaults to a unique, but stable (based on the application name) number.\n\nExamples of valid values:\n- 8080\n- my.localhost.me\n- my.localhost.me:8080\n- https://my.localhost.me\n- https://my.localhost.me:8080"
1280
+ description: "A local port number or host that this application runs on when it is running locally. If passing a string, include the protocol (optional), host (required) and port (optional).\n\nExamples of valid values: 8080, my.localhost.me, my.localhost.me:8080, https://my.localhost.me, https://my.localhost.me:8080.\n\nThe default value is http://localhost:<port> where port is a stable, unique port number (based on the application name).\n\nSee https://vercel.com/docs/microfrontends/local-development."
1263
1281
  },
1264
1282
  task: {
1265
1283
  type: "string",
1266
- description: "Optional task to run when starting the development server. Should reference a script in the package.json of the application."
1284
+ description: 'The task to run when starting the development server. Should reference a script in the package.json of the application.\n\nThe default value is "dev".\n\nSee https://vercel.com/docs/microfrontends/local-development.'
1267
1285
  },
1268
1286
  fallback: {
1269
1287
  type: "string",
1270
- description: "Fallback for local development, could point to any environment. This is optional for child apps. If not provided, the fallback of the default app will be used.\n\nIf passing a string, include the protocol (optional), host (required) and port (optional). For example: `https://this.ismyhost:8080`. If omitted, the protocol defaults to HTTPS. If omitted, the port defaults to `80` for HTTP and `443` for HTTPS."
1288
+ description: "Fallback for local development, could point to any environment. If not provided for child apps, the fallback of the default app will be used.\n\nIf passing a string, include the protocol (optional), host (required) and port (optional). For example: `https://this.ismyhost:8080`. If omitted, the protocol defaults to HTTPS. If omitted, the port defaults to `80` for HTTP and `443` for HTTPS.\n\nSee https://vercel.com/docs/microfrontends/local-development."
1271
1289
  }
1272
1290
  },
1273
1291
  additionalProperties: false
@@ -1276,29 +1294,46 @@ var schema_default = {
1276
1294
  type: "array",
1277
1295
  items: {
1278
1296
  $ref: "#/definitions/PathGroup"
1279
- }
1297
+ },
1298
+ description: "A list of path groups that are routed to this application."
1280
1299
  },
1281
1300
  PathGroup: {
1282
1301
  type: "object",
1283
1302
  properties: {
1284
1303
  group: {
1285
1304
  type: "string",
1286
- description: "Optional group name for the paths"
1305
+ description: "Group name for the paths."
1287
1306
  },
1288
1307
  flag: {
1289
1308
  type: "string",
1290
- description: "flag name that can be used to enable/disable all paths in the group"
1309
+ description: "The name of the feature flag that controls routing for this group of paths. See https://vercel.com/docs/microfrontends/path-routing#routing-changes-safely-with-flags."
1291
1310
  },
1292
1311
  paths: {
1293
1312
  type: "array",
1294
1313
  items: {
1295
1314
  type: "string"
1296
- }
1315
+ },
1316
+ description: "A list of path expressions that are routed to this application. See https://vercel.com/docs/microfrontends/path-routing#supported-path-expressions."
1297
1317
  }
1298
1318
  },
1299
1319
  required: [
1300
1320
  "paths"
1301
1321
  ],
1322
+ additionalProperties: false,
1323
+ description: "A group of paths that is routed to this application."
1324
+ },
1325
+ Options: {
1326
+ type: "object",
1327
+ properties: {
1328
+ disableOverrides: {
1329
+ type: "boolean",
1330
+ description: "If you want to disable the overrides for the site. For example, if you are managing rewrites between applications externally, you may wish to disable the overrides on the toolbar as they will have no effect.\n\nSee https://vercel.com/docs/microfrontends/managing-microfrontends/vercel-toolbar#routing-overrides."
1331
+ },
1332
+ localProxyPort: {
1333
+ type: "number",
1334
+ description: "The port number used by the local proxy server.\n\nThe default value is 3024.\n\nSee https://vercel.com/docs/microfrontends/local-development."
1335
+ }
1336
+ },
1302
1337
  additionalProperties: false
1303
1338
  }
1304
1339
  }
@@ -1317,19 +1352,19 @@ function formatAjvErrors(errors) {
1317
1352
  return [];
1318
1353
  }
1319
1354
  const errorMessages = [];
1320
- for (const error of errors) {
1321
- if (error.instancePath === "" && (error.keyword === "anyOf" || error.keyword === "required" && error.params.missingProperty === "partOf")) {
1355
+ for (const error2 of errors) {
1356
+ if (error2.instancePath === "" && (error2.keyword === "anyOf" || error2.keyword === "required" && error2.params.missingProperty === "partOf")) {
1322
1357
  continue;
1323
1358
  }
1324
- const instancePath = error.instancePath.slice(1);
1359
+ const instancePath = error2.instancePath.slice(1);
1325
1360
  const formattedInstancePath = instancePath === "" ? "at the root" : `in field ${instancePath}`;
1326
- if (error.keyword === "required" && error.params.missingProperty === "routing" && instancePath.split("/").length === 2) {
1361
+ if (error2.keyword === "required" && error2.params.missingProperty === "routing" && instancePath.split("/").length === 2) {
1327
1362
  errorMessages.push(
1328
1363
  `Unable to infer if ${instancePath} is the default app or a child app. This usually means that there is another error in the configuration.`
1329
1364
  );
1330
- } else if (error.keyword === "anyOf" && instancePath.split("/").length > 2) {
1365
+ } else if (error2.keyword === "anyOf" && instancePath.split("/").length > 2) {
1331
1366
  const anyOfErrors = errors.filter(
1332
- (e) => e.instancePath === error.instancePath && e.keyword !== "anyOf"
1367
+ (e) => e.instancePath === error2.instancePath && e.keyword !== "anyOf"
1333
1368
  );
1334
1369
  if (anyOfErrors.every((e) => e.keyword === "type")) {
1335
1370
  const allowedTypes = LIST_FORMATTER2.format(
@@ -1345,13 +1380,13 @@ function formatAjvErrors(errors) {
1345
1380
  `Invalid field for ${instancePath}. Possible error messages are ${LIST_FORMATTER2.format(anyOfErrors.map((e) => e.message ?? ""))}`
1346
1381
  );
1347
1382
  }
1348
- } else if (error.keyword === "additionalProperties" && !(error.params.additionalProperty === "routing" && instancePath.split("/").length === 2)) {
1383
+ } else if (error2.keyword === "additionalProperties" && !(error2.params.additionalProperty === "routing" && instancePath.split("/").length === 2)) {
1349
1384
  errorMessages.push(
1350
- `Property '${error.params.additionalProperty}' is not allowed ${formattedInstancePath}`
1385
+ `Property '${error2.params.additionalProperty}' is not allowed ${formattedInstancePath}`
1351
1386
  );
1352
- } else if (error.keyword === "required") {
1387
+ } else if (error2.keyword === "required") {
1353
1388
  errorMessages.push(
1354
- `Property '${error.params.missingProperty}' is required ${formattedInstancePath}`
1389
+ `Property '${error2.params.missingProperty}' is required ${formattedInstancePath}`
1355
1390
  );
1356
1391
  }
1357
1392
  }
@@ -1364,8 +1399,8 @@ function validateSchema(configString) {
1364
1399
  const isValid = validate(parsedConfig);
1365
1400
  if (!isValid) {
1366
1401
  throw new MicrofrontendError(
1367
- `Invalid microfrontends config:${formatAjvErrors(validate.errors).map((error) => `
1368
- - ${error}`).join(
1402
+ `Invalid microfrontends config:${formatAjvErrors(validate.errors).map((error2) => `
1403
+ - ${error2}`).join(
1369
1404
  ""
1370
1405
  )}
1371
1406