fix(expo-router)!: compile as ESM

packages/@expo/cli/CHANGELOG.md

@@ -28,6 +28,7 @@
 
 ### 💡 Others
 
+- Depend on internal CJS build of `expo-router`. ([#27638](https://github.com/expo/expo/pull/27638) by [@EvanBacon](https://github.com/EvanBacon))
 - Change server log tag. ([#26834](https://github.com/expo/expo/pull/26834) by [@EvanBacon](https://github.com/EvanBacon))
 - Eagerly perform iOS system checks to speed up iOS simulator launches. ([#26746](https://github.com/expo/expo/pull/26746) by [@EvanBacon](https://github.com/EvanBacon))
 - Enable lazy modules with swc when building `@expo/cli`. ([#27061](https://github.com/expo/expo/pull/27061) by [@byCedric](https://github.com/byCedric))

packages/@expo/cli/src/export/exportStaticAsync.ts

@@ -6,8 +6,7 @@
  */
 import assert from 'assert';
 import chalk from 'chalk';
-import { RouteNode } from 'expo-router/build/Route';
-import { stripGroupSegmentsFromPath } from 'expo-router/build/matchers';
+import type { RouteNode } from 'expo-router/build/Route';
 import path from 'path';
 import resolveFrom from 'resolve-from';
 import { inspect } from 'util';
@@ -261,6 +260,9 @@ async function exportFromServerAsync(
   return files;
 }
 
+const { stripGroupSegmentsFromPath } =
+  require('expo-router/build/cjs/matchers') as typeof import('expo-router/build/matchers');
+
 export function getHtmlFiles({
   manifest,
   includeGroupVariations,

packages/@expo/cli/src/start/server/metro/fetchRouterManifest.ts

@@ -23,7 +23,7 @@ export type ExpoRouterServerManifestV1<TRegex = string> = {
 };
 
 function getExpoRouteManifestBuilderAsync(projectRoot: string) {
-  return require(resolveFrom(projectRoot, 'expo-router/build/routes-manifest'))
+  return require(resolveFrom(projectRoot, 'expo-router/build/cjs/routes-manifest'))
     .createRoutesManifest as typeof import('expo-router/build/routes-manifest').createRoutesManifest;
 }
 

packages/@expo/cli/src/start/server/metro/serializeHtml.ts

@@ -1,5 +1,5 @@
 import { SerialAsset } from '@expo/metro-config/build/serializer/serializerAssets';
-import { RouteNode } from 'expo-router/build/Route';
+import type { RouteNode } from 'expo-router/build/Route';
 
 const debug = require('debug')('expo:metro:html') as typeof console.log;
 

packages/@expo/cli/src/start/server/type-generation/routes.ts

@@ -38,7 +38,7 @@ export interface SetupTypedRoutesOptions {
 export async function setupTypedRoutes(options: SetupTypedRoutesOptions) {
   const typedRoutesModule = resolveFrom.silent(
     options.projectRoot,
-    'expo-router/build/typed-routes'
+    'expo-router/build/cjs/typed-routes'
   );
   return typedRoutesModule ? typedRoutes(typedRoutesModule, options) : legacyTypedRoutes(options);
 }

packages/expo-router/CHANGELOG.md

@@ -4,6 +4,8 @@
 
 ### 🛠 Breaking changes
 
+- Compile as esm with cjs extras. ([#27638](https://github.com/expo/expo/pull/27638) by [@EvanBacon](https://github.com/EvanBacon))
+
 ### 🎉 New features
 
 - Mark React client components with "use client" directives. ([#27300](https://github.com/expo/expo/pull/27300) by [@EvanBacon](https://github.com/EvanBacon))

packages/expo-router/babel.config.js

@@ -1,2 +1,39 @@
-// @generated by expo-module-scripts
-module.exports = require('expo-module-scripts/babel.config.base');
+module.exports = function (api) {
+  const env = api.cache(() => process.env.NODE_ENV);
+  //   api.cache(true);
+  //   const isTest = process.env.NODE_ENV === 'test';
+  if (env === 'test') {
+    return {
+      presets: ['babel-preset-expo'],
+    };
+  }
+
+  // This is the Node.js setting for SSR bundling.
+  return {
+    presets: [
+      [
+        require('@babel/preset-env'),
+        {
+          modules: false, // Disable the default `modules-commonjs`, to enable lazy evaluation
+          targets: {
+            node: '18.0.0',
+          },
+        },
+      ],
+      require('@babel/preset-typescript'),
+      require('@babel/preset-react'),
+    ],
+    plugins: [
+      // Skip this when running in tests. We want the CJS build to be optimized for Node.js, which currently doesn't support native platforms.
+      require('babel-plugin-react-native-web'),
+      require('babel-plugin-dynamic-import-node'),
+      require('@babel/plugin-transform-export-namespace-from'),
+      [
+        require('@babel/plugin-transform-modules-commonjs'),
+        {
+          lazy: () => true,
+        },
+      ],
+    ],
+  };
+};