[router] Support platform extensions for _layout and routes

packages/@expo/cli/CHANGELOG.md

@@ -49,6 +49,7 @@ _This version does not introduce any user-facing changes._
 
 - Fixed `TypeError: osascript(...) is not a function` when pressing "j" to open JS debugger. ([#28315](https://github.com/expo/expo/pull/28315) by [@kudo](https://github.com/kudo))
 - Fix API routes in folders starting with `.` characters. ([#28366](https://github.com/expo/expo/pull/28366) by [@byCedric](https://github.com/byCedric))
+- Allow platform extensions for layout and route files ([#27408](https://github.com/expo/expo/pull/27408) by [@marklawlor](https://github.com/marklawlor))
 
 ## 0.18.0 — 2024-04-18
 

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

@@ -181,7 +181,9 @@ export class MetroBundlerDevServer extends BundlerDevServer {
 
   async getExpoRouterRoutesManifestAsync({ appDir }: { appDir: string }) {
     // getBuiltTimeServerManifest
+    const { exp } = getConfig(this.projectRoot);
     const manifest = await fetchManifest(this.projectRoot, {
+      ...exp.extra?.router?.platformRoutes,
       asJson: true,
       appDir,
     });
@@ -219,10 +221,12 @@ export class MetroBundlerDevServer extends BundlerDevServer {
         }
       );
 
+    const { exp } = getConfig(this.projectRoot);
+
     return {
       serverManifest: await getBuildTimeServerManifestAsync(),
       // Get routes from Expo Router.
-      manifest: await getManifest({ preserveApiRoutes: false }),
+      manifest: await getManifest({ preserveApiRoutes: false, ...exp.extra?.router }),
       // Get route generating function
       async renderAsync(path: string) {
         return await getStaticContent(new URL(path, url));
@@ -574,6 +578,7 @@ export class MetroBundlerDevServer extends BundlerDevServer {
             appDir,
             routerRoot,
             config,
+            ...config.exp.extra?.router,
             bundleApiRoute: (functionFilePath) => this.ssrImportApiRoute(functionFilePath),
             getStaticPageAsync: (pathname) => {
               return this.getStaticPageAsync(pathname);

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

@@ -33,7 +33,7 @@ export function createRouteHandlerMiddleware(
       functionFilePath: string
     ) => Promise<null | Record<string, Function> | Response>;
     config: ProjectConfig;
-  }
+  } & import('expo-router/build/routes-manifest').Options
 ) {
   if (!resolveFrom.silent(projectRoot, 'expo-router')) {
     throw new CommandError(

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

@@ -30,12 +30,15 @@ function getExpoRouteManifestBuilderAsync(projectRoot: string) {
 // TODO: Simplify this now that we use Node.js directly, no need for the Metro bundler caching layer.
 export async function fetchManifest<TRegex = string>(
   projectRoot: string,
-  options: { asJson?: boolean; appDir: string }
+  options: {
+    asJson?: boolean;
+    appDir: string;
+  } & import('expo-router/build/routes-manifest').Options
 ): Promise<ExpoRouterServerManifestV1<TRegex> | null> {
   const getManifest = getExpoRouteManifestBuilderAsync(projectRoot);
   const paths = getRoutePaths(options.appDir);
   // Get the serialized manifest
-  const jsonManifest = getManifest(paths);
+  const jsonManifest = getManifest(paths, options);
 
   if (!jsonManifest) {
     return null;

packages/expo-router/CHANGELOG.md

@@ -31,6 +31,7 @@ _This version does not introduce any user-facing changes._
 - Mark React client components with "use client" directives. ([#27300](https://github.com/expo/expo/pull/27300) by [@EvanBacon](https://github.com/EvanBacon))
 - Add URL hash support ([#27105](https://github.com/expo/expo/pull/27105) by [@marklawlor](https://github.com/marklawlor))
 - Type `Href` is no longer generic ([#27690](https://github.com/expo/expo/pull/27690) by [@marklawlor](https://github.com/marklawlor))
+- Allow platform extensions for layout and route files ([#27408](https://github.com/expo/expo/pull/27408) by [@marklawlor](https://github.com/marklawlor))
 
 ### 🐛 Bug fixes
 

packages/expo-router/_ctx.android.js

@@ -1,6 +1,6 @@
 export const ctx = require.context(
   process.env.EXPO_ROUTER_APP_ROOT,
   true,
-  /^(?:\.\/)(?!(?:(?:(?:.*\+api)|(?:\+html)))\.[tj]sx?$).*\.[tj]sx?$/,
+  /^(?:\.\/)(?!(?:(?:(?:.*\+api)|(?:\+html)))\.[tj]sx?$).*(?:\.ios|\.web)\.[tj]sx?$/,
   process.env.EXPO_ROUTER_IMPORT_MODE
 );

packages/expo-router/_ctx.ios.js

@@ -1,6 +1,6 @@
 export const ctx = require.context(
   process.env.EXPO_ROUTER_APP_ROOT,
   true,
-  /^(?:\.\/)(?!(?:(?:(?:.*\+api)|(?:\+html)))\.[tj]sx?$).*\.[tj]sx?$/,
+  /^(?:\.\/)(?!(?:(?:(?:.*\+api)|(?:\+html)))\.[tj]sx?$).*(?:\.android|\.web)?\.[tj]sx?$/,
   process.env.EXPO_ROUTER_IMPORT_MODE
 );

packages/expo-router/_ctx.web.js

@@ -1,6 +1,6 @@
 export const ctx = require.context(
   process.env.EXPO_ROUTER_APP_ROOT,
   true,
-  /^(?:\.\/)(?!(?:(?:(?:.*\+api)|(?:\+html)))\.[tj]sx?$).*\.[tj]sx?$/,
+  /^(?:\.\/)(?!(?:(?:(?:.*\+api)|(?:\+html)))\.[tj]sx?$).*(?:\.android|\.ios|\.native)?\.[tj]sx?$/,
   process.env.EXPO_ROUTER_IMPORT_MODE
 );