fix(metro-core): use chalk for compat with older node versions

.changeset/purple-bottles-bow.md

@@ -0,0 +1,5 @@
+---
+'@module-federation/metro': patch
+---
+
+fix(metro-core): replace `util.styleText` with chalk for compatibility with older node versions

packages/metro-core/package.json

@@ -60,6 +60,7 @@
     "typecheck": "tsc --noEmit"
   },
   "dependencies": {
+    "chalk": "4.1.2",
     "@expo/metro-runtime": "^5.0.4",
     "@module-federation/runtime": "workspace:*",
     "@module-federation/sdk": "workspace:*"

packages/metro-core/src/commands/bundle-host/index.ts

@@ -1,5 +1,5 @@
 import path from 'node:path';
-import util from 'node:util';
+import chalk from 'chalk';
 import Server from 'metro/src/Server';
 import type { RequestOptions } from 'metro/src/shared/types';
 import type { ModuleFederationConfigNormalized } from '../../types';
@@ -45,7 +45,7 @@ async function bundleFederatedHost(
   const hostEntryFilepath = global.__METRO_FEDERATION_HOST_ENTRY_PATH;
   if (!hostEntryFilepath) {
     logger.error(
-      `${util.styleText('red', 'error')} Cannot determine the host entrypoint path.`,
+      `${chalk.red('error')} Cannot determine the host entrypoint path.`,
     );
     throw new CLIError('Bundling failed');
   }

packages/metro-core/src/commands/bundle-remote/index.ts

@@ -1,7 +1,7 @@
 import { promises as fs } from 'node:fs';
 import path from 'node:path';
 import { pathToFileURL } from 'node:url';
-import util from 'node:util';
+import chalk from 'chalk';
 import { mergeConfig } from 'metro';
 import Server from 'metro/src/Server';
 import type { OutputOptions, RequestOptions } from 'metro/src/shared/types';
@@ -113,7 +113,7 @@ async function bundleFederatedRemote(
   const federationConfig = global.__METRO_FEDERATION_CONFIG;
   if (!federationConfig) {
     logger.error(
-      `${util.styleText('red', 'error')} Module Federation configuration is missing.`,
+      `${chalk.red('error')} Module Federation configuration is missing.`,
     );
     logger.info(
       "Import the plugin 'withModuleFederation' " +
@@ -127,7 +127,7 @@ async function bundleFederatedRemote(
   const containerEntryFilepath = global.__METRO_FEDERATION_REMOTE_ENTRY_PATH;
   if (!containerEntryFilepath) {
     logger.error(
-      `${util.styleText('red', 'error')} Cannot determine the container entry file path.`,
+      `${chalk.red('error')} Cannot determine the container entry file path.`,
     );
     logger.info(
       'To bundle a container, you need to expose at least one module ' +
@@ -140,21 +140,21 @@ async function bundleFederatedRemote(
   const manifestFilepath = global.__METRO_FEDERATION_MANIFEST_PATH;
   if (!manifestFilepath) {
     logger.error(
-      `${util.styleText('red', 'error')} Cannot determine the manifest file path.`,
+      `${chalk.red('error')} Cannot determine the manifest file path.`,
     );
     throw new CLIError('Bundling failed');
   }
 
   if (rawConfig.resolver.platforms.indexOf(args.platform) === -1) {
     logger.error(
-      `${util.styleText('red', 'error')}: Invalid platform ${
-        args.platform ? `"${util.styleText('bold', args.platform)}" ` : ''
+      `${chalk.red('error')}: Invalid platform ${
+        args.platform ? `"${chalk.bold(args.platform)}" ` : ''
       }selected.`,
     );
 
     logger.info(
       `Available platforms are: ${rawConfig.resolver.platforms
-        .map((x) => `"${util.styleText('bold', x)}"`)
+        .map((x) => `"${chalk.bold(x)}"`)
         .join(
           ', ',
         )}. If you are trying to bundle for an out-of-tree platform, it may not be installed.`,
@@ -314,7 +314,7 @@ async function bundleFederatedRemote(
 
   try {
     logger.info(
-      `${util.styleText('blue', 'Processing remote container and exposed modules')}`,
+      `${chalk.blue('Processing remote container and exposed modules')}`,
     );
 
     for (const { requestOpts, saveBundleOpts, targetDir } of requests) {
@@ -338,11 +338,11 @@ async function bundleFederatedRemote(
       // );
     }
 
-    logger.info(`${util.styleText('blue', 'Processing manifest')}`);
+    logger.info(`${chalk.blue('Processing manifest')}`);
     const manifestOutputFilepath = path.resolve(outputDir, 'mf-manifest.json');
     await fs.copyFile(manifestFilepath, manifestOutputFilepath);
     logger.info(
-      `Done writing MF Manifest to:\n${util.styleText('dim', manifestOutputFilepath)}`,
+      `Done writing MF Manifest to:\n${chalk.dim(manifestOutputFilepath)}`,
     );
   } finally {
     // incomplete types - this should be awaited

packages/metro-core/src/commands/utils/save-bundle-and-map.ts

@@ -1,5 +1,5 @@
 import { promises as fs } from 'node:fs';
-import util from 'node:util';
+import chalk from 'chalk';
 import type { MixedSourceMap } from 'metro-source-map';
 import relativizeSourceMapInline from 'metro/src/lib/relativizeSourceMap';
 import type { OutputOptions } from 'metro/src/shared/types';
@@ -28,7 +28,7 @@ export async function saveBundleAndMap(
   const writeFns = [];
 
   writeFns.push(async () => {
-    log(`Writing bundle output to:\n${util.styleText('dim', bundleOutput)}`);
+    log(`Writing bundle output to:\n${chalk.dim(bundleOutput)}`);
     await fs.writeFile(bundleOutput, bundle.code, encoding);
     log('Done writing bundle output');
   });
@@ -43,9 +43,7 @@ export async function saveBundleAndMap(
     }
 
     writeFns.push(async () => {
-      log(
-        `Writing sourcemap output to:\n${util.styleText('dim', sourcemapOutput)}`,
-      );
+      log(`Writing sourcemap output to:\n${chalk.dim(sourcemapOutput)}`);
       await fs.writeFile(sourcemapOutput, map);
       log('Done writing sourcemap output');
     });

packages/metro-core/src/plugin/index.ts

@@ -1,5 +1,5 @@
 import path from 'node:path';
-import util from 'node:util';
+import chalk from 'chalk';
 import type { ConfigT } from 'metro-config';
 import type {
   ModuleFederationConfig,
@@ -45,18 +45,16 @@ export function withModuleFederation(
   }
 
   console.warn(
-    util.styleText(
-      'yellow',
+    chalk.yellow(
       'Warning: Module Federation build is disabled for this command.\n',
     ) +
-      util.styleText(
-        'yellow',
+      chalk.yellow(
         'To enable Module Federation, please use one of the dedicated bundle commands:\n',
       ) +
-      ` ${util.styleText('dim', '•')} bundle-mf-host` +
-      util.styleText('dim', ' - for bundling a host application\n') +
-      ` ${util.styleText('dim', '•')} bundle-mf-remote` +
-      util.styleText('dim', ' - for bundling a remote application\n'),
+      ` ${chalk.dim('•')} bundle-mf-host` +
+      chalk.dim(' - for bundling a host application\n') +
+      ` ${chalk.dim('•')} bundle-mf-remote` +
+      chalk.dim(' - for bundling a remote application\n'),
   );
 
   return config;