@vxrn/vite-plugin-metro 1.27.1 → 2.0.0-beta.101.1

package/src/transformer/metroNativeWorker.test.ts

@@ -35,33 +35,25 @@ const babelCalls = {
 
 vi.mock('@babel/core', async (importOriginal) => {
   const actual = await importOriginal<typeof import('@babel/core')>()
-  return {
-    ...actual,
-    transform: vi.fn((...args: any[]) => {
-      babelCalls.transform++
-      return (actual.transform as any)(...args)
-    }),
-    transformSync: vi.fn((...args: any[]) => {
-      babelCalls.transformSync++
-      return (actual.transformSync as any)(...args)
-    }),
-    transformAsync: vi.fn((...args: any[]) => {
-      babelCalls.transformAsync++
-      return (actual.transformAsync as any)(...args)
-    }),
-    transformFromAstSync: vi.fn((...args: any[]) => {
-      babelCalls.transformFromAstSync++
-      return (actual.transformFromAstSync as any)(...args)
-    }),
-    parse: vi.fn((...args: any[]) => {
-      babelCalls.parse++
-      return (actual.parse as any)(...args)
-    }),
-    parseSync: vi.fn((...args: any[]) => {
-      babelCalls.parseSync++
-      return (actual.parseSync as any)(...args)
-    }),
-  }
+  const names = [
+    'transform',
+    'transformSync',
+    'transformAsync',
+    'transformFromAstSync',
+    'parse',
+    'parseSync',
+  ] as const
+  const counted = Object.fromEntries(
+    names.map((name) => [
+      name,
+      vi.fn((...args: any[]) => {
+        babelCalls[name]++
+        return (actual[name] as any)(...args)
+      }),
+    ])
+  )
+  // @vxrn/compiler reaches babel through the default export, so count that too
+  return { ...actual, ...counted, default: { ...actual, ...counted } }
 })
 
 // module scope so every describe in this file can assert it, not just the first
@@ -74,6 +66,20 @@ beforeEach(() => {
   babelCalls.parseSync = 0
 })
 
+// flow stripping is the one place the worker runs babel: react-native's flow
+// syntax (readonly properties, enums) is beyond fast-flow-transform, so the
+// hermes-parser pass in @vxrn/compiler strips it in a single transform call
+function assertOnlyFlowStripBabelCall() {
+  expect(babelCalls).toEqual({
+    transform: 1,
+    transformSync: 0,
+    transformAsync: 0,
+    transformFromAstSync: 0,
+    parse: 0,
+    parseSync: 0,
+  })
+}
+
 function assertZeroBabelCalls() {
   expect(babelCalls.transform).toBe(0)
   expect(babelCalls.transformSync).toBe(0)
@@ -240,7 +246,9 @@ describe('metroNativeWorker', () => {
       off.find((d) => d.name === 'react-native-worklets-core')!.data.isOptional
     ).toBeUndefined()
 
-    const on = extractDependencies(code, 'setup.js', { allowOptionalDependencies: true })
+    const on = extractDependencies(code, 'setup.js', {
+      allowOptionalDependencies: true,
+    })
     expect(on.find((d) => d.name === 'react-native-worklets-core')!.data.isOptional).toBe(
       true
     )
@@ -403,7 +411,7 @@ describe('metroNativeWorker', () => {
   it('handles Asset files without Babel', async () => {
     const result = await transform(
       {
-        assetRegistryPath: 'react-native/Libraries/Image/AssetRegistry',
+        assetRegistryPath: 'react-native/asset-registry',
         publicPath: '/assets',
       },
       '/project',
@@ -418,10 +426,10 @@ describe('metroNativeWorker', () => {
     expect(result.output[0].data.code).toContain('__d(function')
 
     const depNames = result.dependencies.map((d) => d.name)
-    expect(depNames).toContain('react-native/Libraries/Image/AssetRegistry')
+    expect(depNames).toContain('react-native/asset-registry')
   })
 
-  it('handles Flow files by stripping types without Babel', async () => {
+  it('strips Flow types with a single hermes-parser Babel pass', async () => {
     const flowSource = `
       // @flow
       function add(a: number, b: number): number {
@@ -438,11 +446,41 @@ describe('metroNativeWorker', () => {
       { dev: false, platform: 'ios', type: 'module' }
     )
 
-    assertZeroBabelCalls()
+    assertOnlyFlowStripBabelCall()
     expect(result.output[0].data.code).not.toContain(': number')
     expect(result.output[0].data.code).toContain('function add(a, b)')
   })
 
+  it('lowers React Native Flow enums and readonly properties', async () => {
+    // react-native 0.87 ships VirtualView.js with exported Flow enums, and
+    // readonly object properties throughout its type declarations
+    const flowSource = `
+      // @flow strict-local
+      type Props = { readonly state: VirtualViewRenderState };
+      export enum VirtualViewRenderState {
+        Unknown = 0,
+        Rendered = 1,
+        None = 2,
+      }
+      export function isRendered(state: VirtualViewRenderState): boolean {
+        return state === VirtualViewRenderState.Rendered;
+      }
+    `
+
+    const result = await transform(
+      {},
+      '/project',
+      'node_modules/react-native/src/private/components/virtualview/VirtualView.js',
+      Buffer.from(flowSource, 'utf8'),
+      { dev: false, platform: 'ios', type: 'module' }
+    )
+
+    assertOnlyFlowStripBabelCall()
+    expect(result.output[0].data.code).not.toContain('enum VirtualViewRenderState')
+    expect(result.output[0].data.code).not.toContain('readonly')
+    expect(result.dependencies.map((d) => d.name)).toContain('flow-enums-runtime')
+  })
+
   it('generates a deterministic cache key without Babel', () => {
     const key1 = getCacheKey(
       { globalPrefix: '__one_', minifierPath: 'terser' },
@@ -474,7 +512,7 @@ describe('metroNativeWorker', () => {
     expect(configDefault.defaultConfig.transformerPath).toContain('metroNativeWorker')
     expect(configDefault.defaultConfig.transformer.transformerPath).toBeUndefined()
 
-    // Opting back into babel via metroPluginOptions leaves expo's default
+    // Opting back into babel via metroPluginOptions leaves Metro's default
     // worker in the key, which is itself proof that top level is where metro
     // reads it from.
     const configOptOff = await buildMetroConfigInputFromViteConfig(mockViteConfig, {
@@ -496,6 +534,29 @@ describe('metroNativeWorker', () => {
     delete process.env.ONE_METRO_NATIVE_TRANSFORMS
   })
 
+  it('excludes volatile compiler caches from Metro without hiding package output', async () => {
+    const config = await buildMetroConfigInputFromViteConfig(
+      { root: process.cwd() } as any,
+      { watchman: false }
+    )
+    const blockList = config.defaultConfig.resolver.blockList as RegExp[]
+    const isBlocked = (file: string) => blockList.some((pattern) => pattern.test(file))
+
+    expect(
+      isBlocked(
+        '/home/runner/work/one/one/tests/test-app-cases/node_modules/.vxrn/compiler-cache'
+      )
+    ).toBe(true)
+    expect(
+      isBlocked(
+        'C:\\workspace\\tests\\test-app-cases\\node_modules\\.vxrn\\compiler-cache'
+      )
+    ).toBe(true)
+    expect(isBlocked('/home/runner/work/one/one/packages/one/dist/esm/index.mjs')).toBe(
+      false
+    )
+  })
+
   it('falls back to default Metro babel transformer when a user babel config exists', async () => {
     const tempDir = path.join(process.cwd(), `.tmp-metro-test-${Date.now()}`)
     fs.mkdirSync(tempDir, { recursive: true })
@@ -508,9 +569,12 @@ describe('metroNativeWorker', () => {
       const config1 = await buildMetroConfigInputFromViteConfig(mockViteConfig, {})
       expect(config1.defaultConfig.transformerPath).toContain('metroNativeWorker')
 
-      // Generated @one-generated config is ignored, still uses metroNativeWorker
+      // a config written by `one patch` is ignored, still uses metroNativeWorker
       const babelConfigPath = path.join(tempDir, 'babel.config.js')
-      fs.writeFileSync(babelConfigPath, '// @one-generated\nmodule.exports = {}')
+      fs.writeFileSync(
+        babelConfigPath,
+        '// @one/generated bundler-config\nmodule.exports = {}'
+      )
       const config2 = await buildMetroConfigInputFromViteConfig(mockViteConfig, {})
       expect(config2.defaultConfig.transformerPath).toContain('metroNativeWorker')
 
@@ -547,9 +611,7 @@ describe('metroNativeWorker', () => {
       delete process.env.ONE_METRO_NATIVE_TRANSFORMS
       const mockViteConfig = { root: tempDir } as any
       const warnsWithConfig = (spy: any) =>
-        spy.mock.calls.some((args: any[]) =>
-          args.join(' ').includes(babelConfigPath)
-        )
+        spy.mock.calls.some((args: any[]) => args.join(' ').includes(babelConfigPath))
 
       // explicit option force still uses the worker, but names the dropped config
       const optionWarn = vi.spyOn(console, 'warn').mockImplementation(() => {})
@@ -579,9 +641,7 @@ describe('metroNativeWorker', () => {
       const respectedWarn = vi.spyOn(console, 'warn').mockImplementation(() => {})
       try {
         const respected = await buildMetroConfigInputFromViteConfig(mockViteConfig, {})
-        expect(respected.defaultConfig.transformerPath).not.toContain(
-          'metroNativeWorker'
-        )
+        expect(respected.defaultConfig.transformerPath).not.toContain('metroNativeWorker')
         expect(warnsWithConfig(respectedWarn)).toBe(false)
       } finally {
         respectedWarn.mockRestore()
@@ -610,10 +670,7 @@ describe('metroNativeWorker', () => {
       // user config: both builders fall back to the babel transformer
       const babelConfigPath = path.join(tempDir, 'babel.config.js')
       fs.writeFileSync(babelConfigPath, 'module.exports = { plugins: [] }')
-      const fallbackInput = await buildMetroConfigInputFromViteConfig(
-        mockViteConfig,
-        {}
-      )
+      const fallbackInput = await buildMetroConfigInputFromViteConfig(mockViteConfig, {})
       const fallbackFull = await getMetroConfigFromViteConfig(mockViteConfig, {})
       expect(fallbackInput.defaultConfig.transformerPath).not.toContain(
         'metroNativeWorker'
@@ -629,9 +686,7 @@ describe('metroNativeWorker', () => {
         const forcedFull = await getMetroConfigFromViteConfig(mockViteConfig, {
           nativeTransforms: true,
         })
-        expect(forcedInput.defaultConfig.transformerPath).toContain(
-          'metroNativeWorker'
-        )
+        expect(forcedInput.defaultConfig.transformerPath).toContain('metroNativeWorker')
         expect((forcedFull as any).transformerPath).toContain('metroNativeWorker')
         expect(
           forcedWarn.mock.calls.some((args: any[]) =>
@@ -1262,7 +1317,11 @@ describe('one native transform ports', () => {
   it('inlines import.meta.env reads, which oxc otherwise lowers to an empty object', () => {
     // oxc's CJS lowering emits `var import_meta = {}`, so an untouched
     // `import.meta.env.X` silently reads undefined in every native bundle.
-    const env = { DEV: false, VITE_POSTHOG_API_KEY: 'pk_live', TAMAGUI_TARGET: 'native' }
+    const env = {
+      DEV: false,
+      VITE_POSTHOG_API_KEY: 'pk_live',
+      TAMAGUI_TARGET: 'native',
+    }
     const out = applyInlineEnvVars(
       `export const key = import.meta.env.VITE_POSTHOG_API_KEY;
 export const target = import.meta.env?.TAMAGUI_TARGET;
@@ -1357,7 +1416,9 @@ export const all = { ...import.meta.env };`,
     // takeout adds `hot-updater/babel-plugin` for OTA; dropping it silently
     // would ship a build whose updates never apply.
     const withPlugins = (plugins: any[]) =>
-      ({ customTransformOptions: { vite: { babelConfig: { plugins } } } }) as any
+      ({
+        customTransformOptions: { vite: { babelConfig: { plugins } } },
+      }) as any
 
     expect(() =>
       assertNoUnportedBabelPlugins(
@@ -1455,3 +1516,160 @@ describe('metro babel fallback config names', () => {
     }
   })
 })
+
+describe('one public env contract in the metro worker', () => {
+  it('inlines One and Expo public reads in dev and prod with no virtual module', () => {
+    for (const isProduction of [false, true]) {
+      const out = applyInlineEnvVars(
+        `export const values = [process.env.ONE_PUBLIC_API, process.env.EXPO_PUBLIC_API, import.meta.env.EXPO_PUBLIC_API];
+export const all = { ...import.meta.env };`,
+        'env.ts',
+        isProduction,
+        { ONE_PUBLIC_API: 'https://api.test' }
+      )
+      expect(out).toContain(
+        'export const values = ["https://api.test", "https://api.test", "https://api.test"];'
+      )
+      expect(out).toContain('"EXPO_PUBLIC_API":"https://api.test"')
+      expect(out).not.toContain('expo/virtual/env')
+      expect(out).not.toContain('_$$_EXPO_ENV')
+    }
+  })
+
+  it('preserves explicit conflicting values', () => {
+    for (const isProduction of [false, true]) {
+      const out = applyInlineEnvVars(
+        'export const values = [process.env.ONE_PUBLIC_API, process.env.EXPO_PUBLIC_API];',
+        'env.ts',
+        isProduction,
+        { ONE_PUBLIC_API: 'one', EXPO_PUBLIC_API: 'expo' }
+      )
+      expect(out).toBe('export const values = ["one", "expo"];')
+    }
+  })
+
+  it('accepts Expo runtime feature flags that are not configured', () => {
+    const out = applyInlineEnvVars(
+      'export const useRnFetch = process.env.EXPO_PUBLIC_USE_RN_FETCH;',
+      '/app/node_modules/expo/build/winter/runtime.native.js',
+      false,
+      { EXPO_PUBLIC_USE_RN_FETCH: undefined }
+    )
+    expect(out).toBe('export const useRnFetch = undefined;')
+  })
+
+  it('carries public aliases through the whole import.meta.env object', () => {
+    const out = applyInlineEnvVars(
+      'export const all = { ...import.meta.env };',
+      'env.ts',
+      true,
+      { ONE_PUBLIC_API: 'one' }
+    )
+    expect(out).toContain('"ONE_PUBLIC_API":"one"')
+    expect(out).toContain('"EXPO_PUBLIC_API":"one"')
+  })
+})
+
+describe('optional expo virtual env', () => {
+  const virtualFilename = '/proj/node_modules/expo/virtual/env.js'
+  const virtualSource = 'export const env = process.env;'
+
+  function runFactory(
+    code: string,
+    opts: { requireImpl: (...args: any[]) => any; procEnv: Record<string, string> }
+  ) {
+    const module = { exports: {} as any }
+    vm.runInNewContext(code, {
+      __d(factory: any) {
+        factory(
+          {},
+          opts.requireImpl,
+          (v: any) => v,
+          (v: any) => v,
+          module,
+          module.exports,
+          []
+        )
+      },
+      process: { env: opts.procEnv },
+      console,
+    })
+    return module.exports
+  }
+
+  const noRequire = () => {
+    throw new Error('unexpected require call')
+  }
+
+  it('merges .env files over process.env in dev like upstream', async () => {
+    const result = await transform({}, '/proj', virtualFilename, Buffer.from(virtualSource), {
+      dev: true,
+      minify: false,
+      platform: 'ios',
+      type: 'module',
+      customTransformOptions: { environment: 'client' },
+    })
+    const code = result.output[0].data.code
+    expect(code).toContain('dotEnvModules')
+    expect(code).toContain('.env.development.local')
+    const contextModule: any = () => ({
+      default: { EXPO_PUBLIC_SENTINEL_DOTENV: 'dotenv-sentinel-value' },
+    })
+    contextModule.keys = () => ['./.env']
+    // metro lowers require.context(rel) to require(contextId, rel)
+    const requireImpl: any = (_id: unknown, _rel?: unknown) => contextModule
+    const mod = runFactory(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', async () => {
+    const result = await transform({}, '/proj', virtualFilename, Buffer.from(virtualSource), {
+      dev: false,
+      minify: false,
+      platform: 'ios',
+      type: 'module',
+      customTransformOptions: { environment: 'client' },
+    })
+    const mod = runFactory(result.output[0].data.code, {
+      requireImpl: noRequire,
+      procEnv: {},
+    })
+    expect(() => mod.env.EXPO_PUBLIC_ANYTHING).toThrow(
+      'not supported in production bundles'
+    )
+  })
+
+  it('leaves .env files alone without Expo installed', async () => {
+    const result = await transform(
+      {},
+      '/proj-no-expo',
+      '/proj-no-expo/.env',
+      Buffer.from('EXPO_PUBLIC_A=1\nSECRET=2\n'),
+      {
+        dev: true,
+        minify: false,
+        platform: 'ios',
+        type: 'module',
+        customTransformOptions: { environment: 'client' },
+      }
+    )
+    const code = result.output[0].data.code
+    expect(code).toContain('EXPO_PUBLIC_A')
+    expect(code).not.toContain('EXPO_PUBLIC_A":"1')
+  })
+
+  it('leaves the virtual module alone outside client environments', async () => {
+    const result = await transform({}, '/proj', virtualFilename, Buffer.from(virtualSource), {
+      dev: true,
+      minify: false,
+      platform: 'ios',
+      type: 'module',
+      customTransformOptions: { environment: 'react-server' },
+    })
+    expect(result.output[0].data.code).not.toContain('require.context')
+  })
+})

package/src/transformer/metroNativeWorker.ts

@@ -8,10 +8,14 @@ import remapping from '@jridgewell/remapping'
 import { TraceMap, eachMapping } from '@jridgewell/trace-mapping'
 import {
   shouldStripFlow,
+  stripFlowTypes,
   transformHermesAsync,
   transformHermesLoops,
   transformReactNativeCodegen,
 } from '@vxrn/compiler'
+import { withExpoPublicEnvAliases } from '@vxrn/utils/publicEnv'
+
+import { substituteExpoVirtualEnvSource } from './expoVirtualEnv'
 import { getPlatformEnv, metroPlatformToViteEnvironment } from '../env/platformEnv'
 
 /**
@@ -514,16 +518,15 @@ export function applyModuleResolverAliases(
 }
 
 /**
- * Native port of babel-preset-expo's `expo-inline-or-reference-env-vars` and
- * one's `babel-plugin-inline-one-server-url`. In production every
- * `process.env.EXPO_PUBLIC_*` read is inlined as a literal; in development each
- * one is routed through the `expo/virtual/env` module so edits to .env take
- * effect without a full rebuild. Without this the reads survive into the bundle
- * and every EXPO_PUBLIC_ value is undefined at runtime.
+ * Native port of one's `babel-plugin-inline-one-server-url` for public env.
+ * Every `process.env.ONE_PUBLIC_*` or `process.env.EXPO_PUBLIC_*` read is
+ * inlined as a literal in both modes,
+ * matching the rolldown native defines: a native runtime has no `process.env`
+ * to read it back out of, and without this the reads survive into the bundle
+ * and every public value is undefined at runtime.
  *
  * `process.env.ONE_SERVER_URL` is inlined in both modes, matching one's plugin:
- * it is how a native bundle knows where to fetch loader data from, and a native
- * runtime has no `process.env` to read it back out of.
+ * it is how a native bundle knows where to fetch loader data from.
  *
  * Both live in one pass because they are the same rewrite over the same walk,
  * and a second parse of every file is the cost this transformer exists to avoid.
@@ -542,8 +545,14 @@ export function applyInlineEnvVars(
   }
   if (!parsed?.program) return code
 
+  const processPublicEnv = Object.fromEntries(
+    Object.entries(process.env).filter(
+      ([key]) => key.startsWith('ONE_PUBLIC_') || key.startsWith('EXPO_PUBLIC_')
+    )
+  )
+  const effectiveEnv = withExpoPublicEnvAliases({ ...processPublicEnv, ...env })
+
   const ms = new MagicString(code)
-  let needsEnvImport = false
 
   // edits are collected rather than written straight through, because a folded
   // dead branch swallows the range an inner edit sits in and MagicString throws
@@ -596,13 +605,12 @@ export function applyInlineEnvVars(
         return
       }
 
-      if (isProcessEnv && !isAssignmentTarget && key?.startsWith('EXPO_PUBLIC_')) {
-        if (isProduction) {
-          replace(node, process.env[key] ?? undefined)
-        } else {
-          edits.push({ start: node.start, end: node.end, text: `_$$_EXPO_ENV.${key}` })
-          needsEnvImport = true
-        }
+      if (
+        isProcessEnv &&
+        !isAssignmentTarget &&
+        (key?.startsWith('ONE_PUBLIC_') || key?.startsWith('EXPO_PUBLIC_'))
+      ) {
+        replace(node, effectiveEnv[key] ?? undefined)
         return
       }
 
@@ -615,21 +623,30 @@ export function applyInlineEnvVars(
         keyOf(obj.property, obj.computed) === 'env' &&
         key !== undefined
       ) {
-        replace(node, env[key])
+        replace(node, effectiveEnv[key])
         return
       }
 
       // bare `import.meta.env`, spread or passed around whole.
       if (!isAssignmentTarget && isImportMeta(obj) && key === 'env') {
-        edits.push({ start: node.start, end: node.end, text: JSON.stringify(env) })
+        edits.push({
+          start: node.start,
+          end: node.end,
+          text: JSON.stringify(effectiveEnv),
+        })
         return
       }
 
       // `process.env.X` for anything the vite env map defines. runs after the
-      // two branches above so ONE_SERVER_URL and EXPO_PUBLIC_ keep their own
+      // branches above so ONE_SERVER_URL and public env keep their own
       // handling.
-      if (isProcessEnv && !isAssignmentTarget && key !== undefined && key in env) {
-        replace(node, env[key])
+      if (
+        isProcessEnv &&
+        !isAssignmentTarget &&
+        key !== undefined &&
+        key in effectiveEnv
+      ) {
+        replace(node, effectiveEnv[key])
         return
       }
     }
@@ -725,9 +742,6 @@ export function applyInlineEnvVars(
     ms.overwrite(edit.start, edit.end, edit.text)
   }
 
-  if (needsEnvImport) {
-    ms.prepend(`import { env as _$$_EXPO_ENV } from "expo/virtual/env";\n`)
-  }
   return ms.hasChanged() ? ms.toString() : code
 }
 
@@ -1884,39 +1898,16 @@ export async function transform(
 
   let sourceCode = typeof data === 'string' ? data : data.toString('utf8')
 
-  // expo's own transform worker substitutes the source of two virtual files
-  // before transforming them. this worker replaces that worker outright, so
-  // without the same substitution `expo/virtual/env` stays a bare
-  // `process.env` re-export and no .env file ever reaches the bundle.
-  const environment = options.customTransformOptions?.environment
-  const isClientEnvironment = environment !== 'node' && environment !== 'react-server'
-
-  if (isClientEnvironment && /[\\/]expo[\\/]virtual[\\/]env\.js$/.test(filename)) {
-    if (options.dev) {
-      const rel = path
-        .relative(path.dirname(filename), projectRoot)
-        .split(path.sep)
-        .join('/')
-      sourceCode = `const dotEnvModules = require.context(${JSON.stringify(rel)},false,/^\\.\\/\\.env/);
-export const env = !dotEnvModules.keys().length ? process.env : { ...process.env, ...['.env', '.env.development', '.env.local', '.env.development.local'].reduce((acc, file) => {
-  return { ...acc, ...(dotEnvModules(file)?.default ?? {}) };
-}, {}) };`
-    } else {
-      // production inlines every value at its use site, so reaching this module
-      // at all is a bug worth naming rather than silently returning undefined.
-      sourceCode = `export const env = new Proxy({}, {
-  get(target, key) {
-    throw new Error(\`Attempting to access internal environment variable "\${String(key)}" is not supported in production bundles.\`);
-  },
-});`
-    }
-  } else if (
-    /(^|[\\/])\.env(\.(local|(development|production)(\.local)?))?$/.test(filename)
-  ) {
-    const { parseEnvFile } =
-      await import('@expo/metro-config/build/transform-worker/dot-env-development')
-    sourceCode = `export default ${JSON.stringify(parseEnvFile(sourceCode, isClientEnvironment))};`
-  }
+  // narrow optional Expo compatibility, shared with the babel
+  // transformer: only expo/virtual/env.js and .env files are special, and
+  // apps without Expo installed never resolve or load any Expo module.
+  sourceCode = substituteExpoVirtualEnvSource({
+    filename,
+    src: sourceCode,
+    projectRoot,
+    dev: options.dev,
+    environment: options.customTransformOptions?.environment,
+  })
 
   checkReservedStrings(sourceCode, config, options)
 
@@ -1986,8 +1977,7 @@ export const env = !dotEnvModules.keys().length ? process.env : { ...process.env
 
   // 2. Asset files
   if (options.type === 'asset') {
-    const assetRegistryPath =
-      config.assetRegistryPath || 'react-native/Libraries/Image/AssetRegistry'
+    const assetRegistryPath = config.assetRegistryPath || 'react-native/asset-registry'
     let properDescriptor: any = null
 
     const absolutePath = path.resolve(projectRoot, filename)
@@ -2144,15 +2134,7 @@ export const env = !dotEnvModules.keys().length ? process.env : { ...process.env
   // Step A: Flow stripping
   if (shouldStripFlow(filename, code)) {
     try {
-      const fft = await import('fast-flow-transform')
-      const flowTransform = fft.default || fft
-      const flowResult = await flowTransform({
-        filename,
-        source: code,
-        sourcemap: true,
-        dialect: 'flow',
-        format: 'pretty',
-      })
+      const flowResult = await stripFlowTypes(filename, code)
       if (flowResult?.code) {
         code = flowResult.code
         if (flowResult.map) {
@@ -2185,9 +2167,9 @@ export const env = !dotEnvModules.keys().length ? process.env : { ...process.env
     }
   }
 
-  // Step A2: expo public env vars, one's server url, and `import.meta.env`.
-  // after flow stripping so the parse succeeds, before extraction so both the
-  // injected `expo/virtual/env` import and any folded-away dead branch are seen.
+  // Step A2: one public env vars, one's server url, and `import.meta.env`.
+  // after flow stripping so the parse succeeds, before extraction so any
+  // folded-away dead branch is seen.
   // the substring guards keep the extra parse off files with no such read at all.
   if (code.includes('process.env') || code.includes('import.meta')) {
     code = applyInlineEnvVars(code, filename, !options.dev, getImportMetaEnv(options))

package/src/transformer/transformSync.test.ts

@@ -47,4 +47,26 @@ describe('transformSync', () => {
       )
     ).toThrow('use `importForwarding.moduleNames`')
   })
+
+  it('parses the readonly Flow interfaces shipped by React Native 0.87', () => {
+    const result = transformSync(
+      `// @flow strict
+interface Registration<TArgs> {
+  readonly context: unknown;
+  readonly listener: (...args: TArgs) => unknown;
+}
+export function readContext(registration: Registration<[]>): unknown {
+  return registration.context;
+}`,
+      {
+        filename: '/project/node_modules/react-native/EventEmitter.js',
+        babelrc: false,
+        configFile: false,
+        presets: [require('@react-native/babel-preset')],
+      },
+      { hermesParser: true }
+    )
+
+    expect(result?.code).toContain('function readContext(registration)')
+  })
 })