@vxrn/vite-plugin-metro 2.0.0-beta.51.1 → 2.0.0-beta.56.1

package/src/metro-config/getMetroConfigFromViteConfig.ts

@@ -1,24 +1,23 @@
-import type { ResolvedConfig } from 'vite'
+import { searchForWorkspaceRoot, type ResolvedConfig } from 'vite'
 import { spawn } from 'node:child_process'
 import { resolve } from 'node:path'
 import micromatch from 'micromatch'
+import { getDefaultConfig } from '@react-native/metro-config'
 
-// For Metro and Expo, we only import types here.
-// We use `projectImport` to dynamically import the actual modules
-// at runtime to ensure they are loaded from the user's project root.
+// metro itself is loaded from the app so its cli and config stay aligned.
+// the base config belongs to this package and matches its react-native peer.
 import type { loadConfig as loadConfigT } from 'metro'
-import type { getDefaultConfig as getDefaultConfigT } from '@expo/metro-config'
 
 import { findUserBabelConfig } from '@vxrn/compiler'
 import { projectImport, projectResolve } from '../utils/projectImport'
 import { getTerminalReporter } from '../utils/getTerminalReporter'
-import { patchExpoGoManifestHandlerMiddlewareWithCustomMainModuleName } from '../utils/patchExpoGoManifestHandlerMiddlewareWithCustomMainModuleName'
 import type { MetroPluginOptions } from '../plugins/metroPlugin'
 import type { ExtraConfig, MetroConfigExtended } from './types'
 
-type MetroInputConfig = Parameters<typeof loadConfigT>[1]
+type MetroInputConfig = NonNullable<Parameters<typeof loadConfigT>[1]>
 
 const WATCHMAN_PROBE_TIMEOUT_MS = 2000
+const expoEnvAdditionalExts = ['env', 'local', 'development']
 const watchmanResponsivePromises = new Map<string, Promise<boolean>>()
 let didWarnAboutWatchmanFallback = false
 const rootIndexBundleRequestPattern = /^(https?:\/\/[^/]+)?\/index\.bundle(?=$|[?#])/
@@ -32,6 +31,36 @@ const metroWatchExclusions = [
   /[/\\]node_modules[/\\]\.vxrn(?:[/\\]|$)/,
 ]
 
+function enforceWorkspaceVisibility(
+  config: MetroInputConfig,
+  projectRoot: string
+): MetroInputConfig {
+  const workspaceRoot = searchForWorkspaceRoot(projectRoot)
+  if (workspaceRoot === projectRoot) return config
+
+  return {
+    ...config,
+    watchFolders: [...new Set([...(config.watchFolders ?? []), workspaceRoot])],
+    resolver: {
+      ...config.resolver,
+      nodeModulesPaths: [
+        ...new Set([
+          ...(config.resolver?.nodeModulesPaths ?? []),
+          resolve(projectRoot, 'node_modules'),
+          resolve(workspaceRoot, 'node_modules'),
+        ]),
+      ],
+    },
+  }
+}
+
+function getReactNativeDefaultConfig(projectRoot: string): MetroInputConfig {
+  return enforceWorkspaceVisibility(
+    getDefaultConfig(projectRoot) as MetroInputConfig,
+    projectRoot
+  )
+}
+
 function getPlatformFromBundleUrl(url: string): 'ios' | 'android' {
   const platform = url.match(/[?&]platform=(ios|android)(?:&|$)/)?.[1]
   return platform === 'android' ? 'android' : 'ios'
@@ -45,13 +74,43 @@ function rewriteMainModuleBundleUrl(
     platform: getPlatformFromBundleUrl(url),
   })
 
-  if (url.includes('/.expo/.virtual-metro-entry.bundle?')) {
-    return url.replace('.expo/.virtual-metro-entry', resolvedMainModulePath)
-  }
-
   return url.replace(rootIndexBundleRequestPattern, `$1/${resolvedMainModulePath}.bundle`)
 }
 
+function isBareSpecifier(name: string) {
+  return name !== '' && !name.startsWith('.') && !name.startsWith('/')
+}
+
+// metro parses `/one/metro-entry.bundle` to the entry `./one/metro-entry`
+// relative to the server root, which misses node_modules package lookup.
+function bareMainModuleForRequest(
+  moduleName: string,
+  mainModuleName: string | undefined
+) {
+  if (!mainModuleName || !isBareSpecifier(mainModuleName)) return undefined
+  if (moduleName === `./${mainModuleName}`) return mainModuleName
+  return undefined
+}
+
+// defaultConfigOverrides and Metro config loading can replace the resolver.
+// enforce package semantics on the final config while leaving every other
+// request on the resolver selected by that composition.
+function enforceBareMainModuleEntry(config: any, mainModuleName: string | undefined) {
+  if (!mainModuleName || !isBareSpecifier(mainModuleName)) return config
+  const innerResolveRequest = config?.resolver?.resolveRequest
+  return {
+    ...config,
+    resolver: {
+      ...config?.resolver,
+      resolveRequest: (context: any, moduleName: string, platform: string) => {
+        const bareMain = bareMainModuleForRequest(moduleName, mainModuleName)
+        const resolveRequest = innerResolveRequest || context.resolveRequest
+        return resolveRequest(context, bareMain ?? moduleName, platform)
+      },
+    },
+  }
+}
+
 async function isWatchmanResponsive(projectRoot: string) {
   let probe = watchmanResponsivePromises.get(projectRoot)
   if (probe) {
@@ -135,7 +194,7 @@ function resolveNativeTransforms(
  * Build the Metro config input WITHOUT calling Metro's `loadConfig`. Returns
  * the same shape Metro `loadConfig` expects as its second argument. Use this
  * from a project's `metro.config.cjs` so the outer `loadConfig` (driven by
- * Expo CLI / Metro CLI) is the only one that runs — avoids infinite
+ * the Metro CLI) is the only one that runs. this avoids infinite
  * recursion that would happen if the inner pipeline also called `loadConfig`
  * and re-read the same metro.config.cjs.
  */
@@ -156,53 +215,20 @@ export async function buildMetroConfigInputFromViteConfig(
     )
   }
 
-  const { getDefaultConfig } = await projectImport<{
-    getDefaultConfig: typeof getDefaultConfigT
-  }>(projectRoot, '@expo/metro-config')
-
-  const _defaultConfig: MetroInputConfig = getDefaultConfig(projectRoot) as any
+  const _defaultConfig = getReactNativeDefaultConfig(projectRoot)
 
   if (mainModuleName) {
-    const origRewriteRequestUrl = _defaultConfig!.server!.rewriteRequestUrl!
-
-    const resolveMainModuleName: (p: { platform: 'ios' | 'android' }) => string =
-      await (async () => {
-        const ExpoGoManifestHandlerMiddleware = (
-          await projectImport(
-            projectRoot,
-            '@expo/cli/build/src/start/server/middleware/ExpoGoManifestHandlerMiddleware.js'
-          )
-        ).default.ExpoGoManifestHandlerMiddleware
-
-        const manifestHandlerMiddleware = new ExpoGoManifestHandlerMiddleware(
-          projectRoot,
-          {}
-        )
-
-        patchExpoGoManifestHandlerMiddlewareWithCustomMainModuleName(
-          manifestHandlerMiddleware,
-          mainModuleName
-        )
-
-        return (p) => {
-          return manifestHandlerMiddleware.resolveMainModuleName({
-            pkg: { main: mainModuleName },
-            platform: p.platform,
-          })
-        }
-      })()
+    const origRewriteRequestUrl = _defaultConfig!.server?.rewriteRequestUrl
+    const resolveMainModuleName = () => mainModuleName
 
     extraConfig.getResolveMainModuleName = resolveMainModuleName
 
     // @ts-expect-error Metro 0.83 made this read-only in types but we need to patch it
     _defaultConfig!.server!.rewriteRequestUrl = (url) => {
-      if (
-        url.includes('/.expo/.virtual-metro-entry.bundle?') ||
-        rootIndexBundleRequestPattern.test(url)
-      ) {
+      if (rootIndexBundleRequestPattern.test(url)) {
         return rewriteMainModuleBundleUrl(url, resolveMainModuleName)
       }
-      return origRewriteRequestUrl(url)
+      return origRewriteRequestUrl?.(url) ?? url
     }
   }
 
@@ -233,6 +259,15 @@ export async function buildMetroConfigInputFromViteConfig(
 
   const defaultConfig: MetroInputConfig = {
     ..._defaultConfig,
+    watcher: {
+      ..._defaultConfig?.watcher,
+      additionalExts: [
+        ...new Set([
+          ...(_defaultConfig?.watcher?.additionalExts ?? []),
+          ...expoEnvAdditionalExts,
+        ]),
+      ],
+    },
     resolver: {
       ..._defaultConfig?.resolver,
       useWatchman,
@@ -269,6 +304,10 @@ export async function buildMetroConfigInputFromViteConfig(
     },
     transformer: {
       ..._defaultConfig?.transformer,
+      // one's router and Expo's optional development env module both use
+      // require.context. Metro installs a throwing runtime stub unless this
+      // graph feature is enabled.
+      unstable_allowRequireContext: true,
       babelTransformerPath: projectResolve(
         projectRoot,
         '@vxrn/vite-plugin-metro/babel-transformer'
@@ -287,7 +326,14 @@ export async function buildMetroConfigInputFromViteConfig(
       : defaultConfigOverrides),
   }
 
-  return { defaultConfig: merged, projectRoot, extraConfig }
+  return {
+    defaultConfig: enforceBareMainModuleEntry(
+      enforceWorkspaceVisibility(merged, projectRoot),
+      mainModuleName
+    ),
+    projectRoot,
+    extraConfig,
+  }
 }
 
 export async function getMetroConfigFromViteConfig(
@@ -313,60 +359,21 @@ export async function getMetroConfigFromViteConfig(
   const { loadConfig } = await projectImport<{
     loadConfig: typeof loadConfigT
   }>(projectRoot, 'metro')
-  const { getDefaultConfig } = await projectImport<{
-    getDefaultConfig: typeof getDefaultConfigT
-  }>(projectRoot, '@expo/metro-config')
-
-  const _defaultConfig: MetroInputConfig = getDefaultConfig(projectRoot) as any
+  const _defaultConfig = getReactNativeDefaultConfig(projectRoot)
 
   if (mainModuleName) {
-    const origRewriteRequestUrl = _defaultConfig!.server!.rewriteRequestUrl!
-
-    // We need to patch Expo's default `config.server.rewriteRequestUrl`
-    // to change how URLs like '/.expo/.virtual-metro-entry.bundle?' are
-    // rewritten.
-    // But since that function is difficult to override, here we borrow
-    // the ExpoGoManifestHandlerMiddleware and use it to resolve the
-    // URL to the main module name.
-    const resolveMainModuleName: (p: { platform: 'ios' | 'android' }) => string =
-      await (async () => {
-        const ExpoGoManifestHandlerMiddleware = (
-          await projectImport(
-            projectRoot,
-            '@expo/cli/build/src/start/server/middleware/ExpoGoManifestHandlerMiddleware.js'
-          )
-        ).default.ExpoGoManifestHandlerMiddleware
-
-        const manifestHandlerMiddleware = new ExpoGoManifestHandlerMiddleware(
-          projectRoot,
-          {}
-        )
-
-        patchExpoGoManifestHandlerMiddlewareWithCustomMainModuleName(
-          manifestHandlerMiddleware,
-          mainModuleName
-        )
-
-        return (p) => {
-          return manifestHandlerMiddleware.resolveMainModuleName({
-            pkg: { main: mainModuleName },
-            platform: p.platform,
-          })
-        }
-      })()
+    const origRewriteRequestUrl = _defaultConfig!.server?.rewriteRequestUrl
+    const resolveMainModuleName = () => mainModuleName
 
     extraConfig.getResolveMainModuleName = resolveMainModuleName
 
     // @ts-expect-error Metro 0.83 made this read-only in types but we need to patch it
     _defaultConfig!.server!.rewriteRequestUrl = (url) => {
-      if (
-        url.includes('/.expo/.virtual-metro-entry.bundle?') ||
-        rootIndexBundleRequestPattern.test(url)
-      ) {
+      if (rootIndexBundleRequestPattern.test(url)) {
         return rewriteMainModuleBundleUrl(url, resolveMainModuleName)
       }
 
-      return origRewriteRequestUrl(url)
+      return origRewriteRequestUrl?.(url) ?? url
     }
   }
 
@@ -397,6 +404,15 @@ export async function getMetroConfigFromViteConfig(
 
   const defaultConfig: MetroInputConfig = {
     ..._defaultConfig,
+    watcher: {
+      ..._defaultConfig?.watcher,
+      additionalExts: [
+        ...new Set([
+          ...(_defaultConfig?.watcher?.additionalExts ?? []),
+          ...expoEnvAdditionalExts,
+        ]),
+      ],
+    },
     resolver: {
       ..._defaultConfig?.resolver,
       useWatchman,
@@ -441,6 +457,10 @@ export async function getMetroConfigFromViteConfig(
     },
     transformer: {
       ..._defaultConfig?.transformer,
+      // one's router and Expo's optional development env module both use
+      // require.context. Metro installs a throwing runtime stub unless this
+      // graph feature is enabled.
+      unstable_allowRequireContext: true,
       babelTransformerPath: projectResolve(
         projectRoot,
         '@vxrn/vite-plugin-metro/babel-transformer'
@@ -468,7 +488,10 @@ export async function getMetroConfigFromViteConfig(
   )
 
   return {
-    ...metroConfig,
+    ...enforceBareMainModuleEntry(
+      enforceWorkspaceVisibility(metroConfig, projectRoot),
+      mainModuleName
+    ),
     ...extraConfig,
   } as MetroConfigExtended
 }

package/src/plugins/metroPlugin.ts

@@ -9,8 +9,7 @@ import { checkAndClearMetroCacheFromVite } from '../utils/metroCacheManager'
 
 const { debug } = createDebugger('vite-plugin-metro')
 
-// For Metro and Expo, we only import types here.
-// We use `projectImport` to dynamically import the actual modules
+// for Metro, we only import types here. `projectImport` loads the actual modules
 // at runtime to ensure they are loaded from the user's project root.
 import type MetroT from 'metro'
 import type { loadConfig as loadConfigT } from 'metro'
@@ -72,10 +71,8 @@ export type MetroPluginOptions = {
   /**
    * Overrides the main module name which is normally defined as the `main` field in `package.json`.
    *
-   * This will affect how `/.expo/.virtual-metro-entry.bundle` behaves.
-   *
-   * It can be used to change the entry point of the React Native app without the need of using
-   * the `main` field in `package.json`.
+   * Changes the React Native entry point without requiring a `main` field in
+   * `package.json`.
    */
   mainModuleName?: string
   /**

package/src/transformer/babel-transformer.test.ts

@@ -0,0 +1,118 @@
+import path from 'node:path'
+import { fileURLToPath } from 'node:url'
+import vm from 'node:vm'
+import { describe, expect, it } from 'vitest'
+
+import { transformFromAstSync } from './babel-core'
+// @ts-expect-error: module.exports = has no default export in types, runtime interop provides it
+import babelTransformer from './babel-transformer'
+
+const fixturesDir = path.join(
+  path.dirname(fileURLToPath(import.meta.url)),
+  '__fixtures__'
+)
+const virtualFilename = '/proj/node_modules/expo/virtual/env.js'
+const virtualSource = 'export const env = process.env;'
+
+function runBabelTransform(src: string, filename: string, dev: boolean): any {
+  // the transformer leaks BABEL_ENV=development when it was previously
+  // unset; keep that pre-existing leak out of sibling tests.
+  const OLD_BABEL_ENV = process.env.BABEL_ENV
+  try {
+    return (babelTransformer as any).transform({
+      filename,
+      src,
+      options: {
+        projectRoot: fixturesDir,
+        dev,
+        platform: 'ios',
+        customTransformOptions: {
+          environment: 'client',
+          vite: {
+            oneViteMetroBabelConfig: true,
+            babelConfig: {
+              babelrc: false,
+              configFile: false,
+              presets: [],
+              plugins: [],
+            },
+          },
+        },
+      },
+      plugins: [],
+    })
+  } finally {
+    if (OLD_BABEL_ENV === undefined) {
+      delete process.env.BABEL_ENV
+    } else {
+      process.env.BABEL_ENV = OLD_BABEL_ENV
+    }
+  }
+}
+
+function codegen(ast: any, filename: string): string {
+  const out = transformFromAstSync(ast, virtualSource, {
+    filename,
+    babelrc: false,
+    configFile: false,
+    code: true,
+    ast: false,
+  })
+  if (!out?.code) {
+    throw new Error('codegen produced no code')
+  }
+  return out.code
+}
+
+function runCjs(
+  code: string,
+  opts: { requireImpl: (...args: any[]) => any; procEnv: Record<string, string> }
+) {
+  const module = { exports: {} as any }
+  vm.runInNewContext(code, {
+    require: opts.requireImpl,
+    module,
+    exports: module.exports,
+    process: { env: opts.procEnv },
+    console,
+  })
+  return module.exports
+}
+
+const noRequire = () => {
+  throw new Error('unexpected require call')
+}
+
+describe('babel-transformer optional expo virtual env', () => {
+  it('merges .env files over process.env in dev like upstream', () => {
+    const result = runBabelTransform(virtualSource, virtualFilename, true)
+    expect(result.ast).toBeTruthy()
+    const code = codegen(result.ast, virtualFilename)
+    expect(code).toContain('require.context')
+    expect(code).toContain('.env.development.local')
+    const contextModule: any = () => ({
+      default: { EXPO_PUBLIC_SENTINEL_DOTENV: 'dotenv-sentinel-value' },
+    })
+    contextModule.keys = () => ['./.env']
+    const requireImpl: any = noRequire
+    requireImpl.context = () => contextModule
+    const mod = runCjs(code, {
+      requireImpl,
+      procEnv: { EXPO_PUBLIC_SENTINEL_PROC: 'proc-sentinel-value' },
+    })
+    expect(mod.env.EXPO_PUBLIC_SENTINEL_DOTENV).toBe('dotenv-sentinel-value')
+    expect(mod.env.EXPO_PUBLIC_SENTINEL_PROC).toBe('proc-sentinel-value')
+  })
+
+  it('throws a naming error in production like upstream', () => {
+    const result = runBabelTransform(virtualSource, virtualFilename, false)
+    expect(result.ast).toBeTruthy()
+    const mod = runCjs(codegen(result.ast, virtualFilename), {
+      requireImpl: noRequire,
+      procEnv: {},
+    })
+    expect(() => mod.env.EXPO_PUBLIC_ANYTHING).toThrow(
+      'not supported in production bundles'
+    )
+  })
+})

package/src/transformer/babel-transformer.ts

@@ -5,20 +5,27 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
-// A fork of the upstream babel-transformer that uses Expo-specific babel defaults
-// and adds support for web and Node.js environments via `isServer` on the Babel caller.
+// a fork of the upstream babel-transformer that adds support for web and node
+// environments via `isServer` on the babel caller.
 // See:
 // * https://github.com/facebook/metro/blob/main/packages/metro-babel-transformer/src/index.js
-// * https://github.com/expo/expo/blob/main/packages/%40expo/metro-config/src/babel-transformer.ts
-import type { BabelTransformer, BabelTransformerArgs } from 'metro-babel-transformer'
+import type {
+  BabelTransformer,
+  BabelTransformerArgs,
+  BabelTransformerCacheKeyOptions,
+} from 'metro-babel-transformer'
 import assert from 'node:assert'
+import { createHash } from 'node:crypto'
+import { readFileSync } from 'node:fs'
+import path from 'node:path'
 
 import type { TransformOptions } from './babel-core'
+import { substituteExpoVirtualEnvSource } from './expoVirtualEnv'
 import { loadBabelConfig } from './loadBabelConfig'
 import { transformSync } from './transformSync'
 import type { ViteCustomTransformOptions } from './types'
 
-export type ExpoBabelCaller = TransformOptions['caller'] & {
+export type MetroBabelCaller = TransformOptions['caller'] & {
   supportsReactCompiler?: boolean
   isReactServer?: boolean
   isHMREnabled?: boolean
@@ -37,7 +44,7 @@ export type ExpoBabelCaller = TransformOptions['caller'] & {
 }
 
 const debug = require('debug')(
-  'expo:metro-config:babel-transformer'
+  'vxrn:metro-config:babel-transformer'
 ) as typeof console.log
 
 function isCustomTruthy(value: any): boolean {
@@ -67,7 +74,7 @@ function getBabelCaller({
   oneViteMetroBabelConfig,
 }: Pick<BabelTransformerArgs, 'filename' | 'options'> & {
   oneViteMetroBabelConfig: boolean
-}): ExpoBabelCaller {
+}): MetroBabelCaller {
   const isNodeModule = filename.includes('node_modules')
   const isReactServer = options.customTransformOptions?.environment === 'react-server'
   const isGenericServer = options.customTransformOptions?.environment === 'node'
@@ -80,7 +87,7 @@ function getBabelCaller({
 
   if (routerRoot == null) {
     memoizeWarning(
-      'Warning: Missing transform.routerRoot option in Metro bundling request, falling back to `app` as routes directory. This can occur if you bundle without Expo CLI or expo/metro-config.'
+      'Warning: Missing transform.routerRoot option in Metro bundling request, falling back to `app` as routes directory.'
     )
   }
 
@@ -119,7 +126,7 @@ function getBabelCaller({
     // target environment.
     engine: stringOrUndefined(options.customTransformOptions?.engine),
 
-    // Provide the project root for accurately reading the Expo config.
+    // provide the project root for reading the app babel config
     projectRoot: options.projectRoot,
     oneViteMetroBabelConfig,
 
@@ -146,17 +153,28 @@ function stringOrUndefined(value: unknown): string | undefined {
 
 const transform: BabelTransformer['transform'] = ({
   filename,
-  src,
+  src: originalSrc,
   options,
-  // `plugins` is used for `functionMapBabelPlugin` from `metro-source-map`. Could make sense to move this to `babel-preset-expo` too.
+  // `plugins` is used for `functionMapBabelPlugin` from `metro-source-map`.
   plugins,
 }: BabelTransformerArgs): ReturnType<BabelTransformer['transform']> => {
+  // narrow optional Expo compatibility (expo/virtual/env.js and .env files
+  // only), shared with the native worker. no-Expo apps pass through byte
+  // for byte without resolving any Expo module.
+  const src = substituteExpoVirtualEnvSource({
+    filename,
+    src: originalSrc,
+    projectRoot: options.projectRoot,
+    dev: options.dev,
+    environment: options.customTransformOptions?.environment,
+  })
+
   const viteCustomTransformOptions = options.customTransformOptions?.vite
 
   const customOptionsFromVite: ViteCustomTransformOptions = (() => {
     const c: any = viteCustomTransformOptions
-    // Standalone Metro invocations (expo export, eas update) don't set
-    // customTransformOptions.vite — the plugins flow entirely through the
+    // standalone Metro invocations don't set
+    // customTransformOptions.vite. the plugins flow entirely through the
     // project's babel.config.cjs in that case. Tolerate the missing field
     // rather than throwing so a single Metro config can serve both the
     // Vite-driven and standalone paths.
@@ -210,8 +228,8 @@ const transform: BabelTransformer['transform'] = ({
       // all (most) of the transforms in their local Babel config.
       // This also helps us keep the transform layers small and focused on a single task. We can also use this to
       // ensure the Babel config caching is more accurate.
-      // Additionally, by moving everything Babel-related to the Babel preset, it makes it easier for users to reason
-      // about the requirements of an Expo project, making it easier to migrate to other transpilers in the future.
+      // moving everything babel-related to the preset also keeps the transform
+      // requirements explicit for users who opt into babel.
       caller: getBabelCaller({
         filename,
         options,
@@ -238,8 +256,57 @@ const transform: BabelTransformer['transform'] = ({
   }
 }
 
+export function getCacheKey(options?: BabelTransformerCacheKeyOptions): string {
+  const hash = createHash('sha256')
+  hash.update('vxrn-metro-babel-transformer-v1')
+
+  const projectRoot = options?.projectRoot
+  if (!projectRoot) {
+    return hash.digest('hex')
+  }
+
+  hash.update(projectRoot)
+
+  for (const file of [
+    '.env',
+    '.env.development',
+    '.env.local',
+    '.env.development.local',
+  ]) {
+    const filename = path.join(projectRoot, file)
+    hash.update(filename)
+    try {
+      hash.update(readFileSync(filename))
+    } catch (error) {
+      if (
+        typeof error === 'object' &&
+        error !== null &&
+        'code' in error &&
+        error.code === 'ENOENT'
+      ) {
+        continue
+      }
+      throw error
+    }
+  }
+
+  hash.update(
+    JSON.stringify(
+      Object.entries(process.env)
+        .filter(
+          ([key]) =>
+            key.startsWith('ONE_PUBLIC_') || key.startsWith('EXPO_PUBLIC_')
+        )
+        .sort(([left], [right]) => left.localeCompare(right))
+    )
+  )
+
+  return hash.digest('hex')
+}
+
 const babelTransformer: BabelTransformer = {
   transform,
+  getCacheKey,
 }
 
 module.exports = babelTransformer