metro 0.81.2 → 0.82.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "metro",
-  "version": "0.81.2",
+  "version": "0.82.0",
   "description": "🚇 The JavaScript bundler for React Native.",
   "main": "src/index.js",
   "bin": "src/cli.js",
@@ -32,7 +32,7 @@
     "chalk": "^4.0.0",
     "ci-info": "^2.0.0",
     "connect": "^3.6.5",
-    "debug": "^2.2.0",
+    "debug": "^4.4.0",
     "error-stack-parser": "^2.0.6",
     "flow-enums-runtime": "^0.0.6",
     "graceful-fs": "^4.2.4",
@@ -42,18 +42,18 @@
     "jest-worker": "^29.7.0",
     "jsc-safe-url": "^0.2.2",
     "lodash.throttle": "^4.1.1",
-    "metro-babel-transformer": "0.81.2",
-    "metro-cache": "0.81.2",
-    "metro-cache-key": "0.81.2",
-    "metro-config": "0.81.2",
-    "metro-core": "0.81.2",
-    "metro-file-map": "0.81.2",
-    "metro-resolver": "0.81.2",
-    "metro-runtime": "0.81.2",
-    "metro-source-map": "0.81.2",
-    "metro-symbolicate": "0.81.2",
-    "metro-transform-plugins": "0.81.2",
-    "metro-transform-worker": "0.81.2",
+    "metro-babel-transformer": "0.82.0",
+    "metro-cache": "0.82.0",
+    "metro-cache-key": "0.82.0",
+    "metro-config": "0.82.0",
+    "metro-core": "0.82.0",
+    "metro-file-map": "0.82.0",
+    "metro-resolver": "0.82.0",
+    "metro-runtime": "0.82.0",
+    "metro-source-map": "0.82.0",
+    "metro-symbolicate": "0.82.0",
+    "metro-transform-plugins": "0.82.0",
+    "metro-transform-worker": "0.82.0",
     "mime-types": "^2.1.27",
     "nullthrows": "^1.1.1",
     "serialize-error": "^2.1.0",
@@ -71,8 +71,8 @@
     "dedent": "^0.7.0",
     "jest-snapshot": "^29.7.0",
     "jest-snapshot-serializer-raw": "^1.2.0",
-    "metro-babel-register": "0.81.2",
-    "metro-memory-fs": "0.81.2",
+    "metro-babel-register": "0.82.0",
+    "metro-memory-fs": "0.82.0",
     "mock-req": "^0.2.0",
     "mock-res": "^0.6.0",
     "stack-trace": "^0.0.10"

package/src/Bundler.js

@@ -11,15 +11,10 @@ class Bundler {
         config.reporter.update({
           type: "transformer_load_started",
         });
-        this._transformer = new Transformer(
-          config,
-          config.watcher.unstable_lazySha1
-            ? {
-                unstable_getOrComputeSha1: (filePath) =>
-                  this._depGraph.unstable_getOrComputeSha1(filePath),
-              }
-            : (...args) => this._depGraph.getSha1(...args)
-        );
+        this._transformer = new Transformer(config, {
+          getOrComputeSha1: (filePath) =>
+            this._depGraph.getOrComputeSha1(filePath),
+        });
         config.reporter.update({
           type: "transformer_load_done",
         });

package/src/Bundler.js.flow

@@ -36,17 +36,10 @@ class Bundler {
       .ready()
       .then(() => {
         config.reporter.update({type: 'transformer_load_started'});
-        this._transformer = new Transformer(
-          config,
-          config.watcher.unstable_lazySha1
-            ? // This object-form API is expected to replace passing a function
-              // once lazy SHA1 is stable. This will be a breaking change.
-              {
-                unstable_getOrComputeSha1: filePath =>
-                  this._depGraph.unstable_getOrComputeSha1(filePath),
-              }
-            : (...args) => this._depGraph.getSha1(...args),
-        );
+        this._transformer = new Transformer(config, {
+          getOrComputeSha1: filePath =>
+            this._depGraph.getOrComputeSha1(filePath),
+        });
         config.reporter.update({type: 'transformer_load_done'});
       })
       .catch(error => {

package/src/DeltaBundler/Transformer.js

@@ -11,14 +11,11 @@ const fs = require("fs");
 const { Cache, stableHash } = require("metro-cache");
 const path = require("path");
 class Transformer {
-  constructor(config, getSha1FnOrOpts) {
+  constructor(config, opts) {
     this._config = config;
     this._config.watchFolders.forEach(verifyRootExists);
     this._cache = new Cache(config.cacheStores);
-    this._getSha1 =
-      typeof getSha1FnOrOpts === "function"
-        ? getSha1FnOrOpts
-        : getSha1FnOrOpts.unstable_getOrComputeSha1;
+    this._getSha1 = opts.getOrComputeSha1;
     const {
       getTransformOptions: _getTransformOptions,
       transformVariants: _transformVariants,
@@ -95,13 +92,9 @@ class Transformer {
       content = fileBuffer;
     } else {
       const result = await this._getSha1(filePath);
-      if (typeof result === "string") {
-        sha1 = result;
-      } else {
-        sha1 = result.sha1;
-        if (result.content) {
-          content = result.content;
-        }
+      sha1 = result.sha1;
+      if (result.content) {
+        content = result.content;
       }
     }
     let fullKey = Buffer.concat([partialKey, Buffer.from(sha1, "hex")]);

package/src/DeltaBundler/Transformer.js.flow

@@ -24,30 +24,24 @@ const fs = require('fs');
 const {Cache, stableHash} = require('metro-cache');
 const path = require('path');
 
-type LazySha1Fn = string => Promise<{content?: Buffer, sha1: string}>;
-type EagerSha1Fn = string => string;
+type GetOrComputeSha1Fn = string => Promise<{content?: Buffer, sha1: string}>;
 
 class Transformer {
   _config: ConfigT;
   _cache: Cache<TransformResult<>>;
   _baseHash: string;
-  _getSha1: EagerSha1Fn | LazySha1Fn;
+  _getSha1: GetOrComputeSha1Fn;
   _workerFarm: WorkerFarm;
 
   constructor(
     config: ConfigT,
-    getSha1FnOrOpts:
-      | $ReadOnly<{unstable_getOrComputeSha1: LazySha1Fn}>
-      | EagerSha1Fn,
+    opts: $ReadOnly<{getOrComputeSha1: GetOrComputeSha1Fn}>,
   ) {
     this._config = config;
 
     this._config.watchFolders.forEach(verifyRootExists);
     this._cache = new Cache(config.cacheStores);
-    this._getSha1 =
-      typeof getSha1FnOrOpts === 'function'
-        ? getSha1FnOrOpts
-        : getSha1FnOrOpts.unstable_getOrComputeSha1;
+    this._getSha1 = opts.getOrComputeSha1;
 
     // Remove the transformer config params that we don't want to pass to the
     // transformer. We should change the config object and move them away so we
@@ -147,13 +141,9 @@ class Transformer {
       content = fileBuffer;
     } else {
       const result = await this._getSha1(filePath);
-      if (typeof result === 'string') {
-        sha1 = result;
-      } else {
-        sha1 = result.sha1;
-        if (result.content) {
-          content = result.content;
-        }
+      sha1 = result.sha1;
+      if (result.content) {
+        content = result.content;
       }
     }
 

package/src/DeltaBundler/types.flow.js.flow

@@ -44,6 +44,11 @@ export type TransformResultDependency = $ReadOnly<{
      * If not null, this dependency is due to a dynamic `import()` or `__prefetchImport()` call.
      */
     asyncType: AsyncDependencyType | null,
+    /**
+     * True if the dependency is declared with a static "import x from 'y'" or
+     * an import() call.
+     */
+    isESMImport: boolean,
     /**
      * The dependency is enclosed in a try/catch block.
      */

package/src/HmrServer.js

@@ -54,6 +54,7 @@ class HmrServer {
         data: {
           key: entryFile,
           asyncType: null,
+          isESMImport: false,
           locs: [],
         },
       }

package/src/HmrServer.js.flow

@@ -125,6 +125,7 @@ class HmrServer<TClient: Client> {
         data: {
           key: entryFile,
           asyncType: null,
+          isESMImport: false,
           locs: [],
         },
       },

package/src/ModuleGraph/worker/collectDependencies.js

@@ -21,6 +21,7 @@ function collectDependencies(ast, options) {
     keepRequireNames: options.keepRequireNames,
     allowOptionalDependencies: options.allowOptionalDependencies,
     unstable_allowRequireContext: options.unstable_allowRequireContext,
+    unstable_isESMImportAtSource: options.unstable_isESMImportAtSource ?? null,
   };
   const visitor = {
     CallExpression(path, state) {
@@ -32,12 +33,14 @@ function collectDependencies(ast, options) {
       if (isImport(callee)) {
         processImportCall(path, state, {
           asyncType: "async",
+          isESMImport: true,
         });
         return;
       }
       if (name === "__prefetchImport" && !path.scope.getBinding(name)) {
         processImportCall(path, state, {
           asyncType: "prefetch",
+          isESMImport: true,
         });
         return;
       }
@@ -79,6 +82,7 @@ function collectDependencies(ast, options) {
       ) {
         processImportCall(path, state, {
           asyncType: "maybeSync",
+          isESMImport: true,
         });
         visited.add(path.node);
         return;
@@ -222,6 +226,7 @@ function processRequireContextCall(path, state) {
       name: directory,
       contextParams,
       asyncType: null,
+      isESMImport: false,
       optional: isOptionalDependency(directory, path, state),
     },
     path
@@ -239,6 +244,7 @@ function processResolveWeakCall(path, state) {
     {
       name,
       asyncType: "weak",
+      isESMImport: false,
       optional: isOptionalDependency(name, path, state),
     },
     path
@@ -261,6 +267,7 @@ See: https://github.com/facebook/metro/pull/1343`
       {
         name: path.node.source.value,
         asyncType: null,
+        isESMImport: true,
         optional: false,
       },
       path
@@ -277,6 +284,7 @@ function processImportCall(path, state, options) {
     {
       name,
       asyncType: options.asyncType,
+      isESMImport: options.isESMImport,
       optional: isOptionalDependency(name, path, state),
     },
     path
@@ -309,11 +317,20 @@ function processRequireCall(path, state) {
     transformer.transformIllegalDynamicRequire(path, state);
     return;
   }
+  let isESMImport = false;
+  if (state.unstable_isESMImportAtSource) {
+    const isImport = state.unstable_isESMImportAtSource;
+    const loc = getNearestLocFromPath(path);
+    if (loc) {
+      isESMImport = isImport(loc);
+    }
+  }
   const dep = registerDependency(
     state,
     {
       name,
       asyncType: null,
+      isESMImport,
       optional: isOptionalDependency(name, path, state),
     },
     path
@@ -502,12 +519,11 @@ function createModuleNameLiteral(dependency) {
   return types.stringLiteral(dependency.name);
 }
 function getKeyForDependency(qualifier) {
-  let key = qualifier.name;
-  const { asyncType } = qualifier;
-  if (asyncType) {
-    key += ["", asyncType].join("\0");
+  const { asyncType, contextParams, isESMImport, name } = qualifier;
+  let key = [name, isESMImport ? "import" : "require"].join("\0");
+  if (asyncType != null) {
+    key += "\0" + asyncType;
   }
-  const { contextParams } = qualifier;
   if (contextParams) {
     key += [
       "",
@@ -529,6 +545,7 @@ class DependencyRegistry {
       const newDependency = {
         name: qualifier.name,
         asyncType: qualifier.asyncType,
+        isESMImport: qualifier.isESMImport,
         locs: [],
         index: this._dependencies.size,
         key: crypto.createHash("sha1").update(key).digest("base64"),

package/src/ModuleGraph/worker/collectDependencies.js.flow

@@ -29,6 +29,7 @@ const {isImport} = types;
 
 type ImportDependencyOptions = $ReadOnly<{
   asyncType: AsyncDependencyType,
+  isESMImport: boolean,
 }>;
 
 export type Dependency = $ReadOnly<{
@@ -56,6 +57,11 @@ type DependencyData = $ReadOnly<{
   // If null, then the dependency is synchronous.
   // (ex. `require('foo')`)
   asyncType: AsyncDependencyType | null,
+  // If true, the dependency is declared using an ESM import, e.g.
+  // "import x from 'y'" or "await import('z')". A resolver should typically
+  // use this to assert either "import" or "require" for conditional exports
+  // and subpath imports.
+  isESMImport: boolean,
   isOptional?: boolean,
   locs: $ReadOnlyArray<BabelSourceLocation>,
   /** Context for requiring a collection of modules. */
@@ -82,6 +88,7 @@ export type State = {
   allowOptionalDependencies: AllowOptionalDependencies,
   /** Enable `require.context` statements which can be used to import multiple files in a directory. */
   unstable_allowRequireContext: boolean,
+  unstable_isESMImportAtSource: ?(BabelSourceLocation) => boolean,
 };
 
 export type Options = $ReadOnly<{
@@ -94,6 +101,7 @@ export type Options = $ReadOnly<{
   dependencyTransformer?: DependencyTransformer,
   /** Enable `require.context` statements which can be used to import multiple files in a directory. */
   unstable_allowRequireContext: boolean,
+  unstable_isESMImportAtSource?: ?(BabelSourceLocation) => boolean,
 }>;
 
 export type CollectedDependencies = $ReadOnly<{
@@ -154,6 +162,7 @@ function collectDependencies(
     keepRequireNames: options.keepRequireNames,
     allowOptionalDependencies: options.allowOptionalDependencies,
     unstable_allowRequireContext: options.unstable_allowRequireContext,
+    unstable_isESMImportAtSource: options.unstable_isESMImportAtSource ?? null,
   };
 
   const visitor = {
@@ -171,6 +180,7 @@ function collectDependencies(
       if (isImport(callee)) {
         processImportCall(path, state, {
           asyncType: 'async',
+          isESMImport: true,
         });
         return;
       }
@@ -178,6 +188,7 @@ function collectDependencies(
       if (name === '__prefetchImport' && !path.scope.getBinding(name)) {
         processImportCall(path, state, {
           asyncType: 'prefetch',
+          isESMImport: true,
         });
         return;
       }
@@ -235,6 +246,10 @@ function collectDependencies(
       ) {
         processImportCall(path, state, {
           asyncType: 'maybeSync',
+          // Treat require.unstable_importMaybeSync as an ESM import, like its
+          // async "await import()" counterpart. Subject to change while
+          // unstable_.
+          isESMImport: true,
         });
         visited.add(path.node);
         return;
@@ -408,6 +423,7 @@ function processRequireContextCall(
       // Capture the matching context
       contextParams,
       asyncType: null,
+      isESMImport: false,
       optional: isOptionalDependency(directory, path, state),
     },
     path,
@@ -433,6 +449,7 @@ function processResolveWeakCall(
     {
       name,
       asyncType: 'weak',
+      isESMImport: false,
       optional: isOptionalDependency(name, path, state),
     },
     path,
@@ -458,6 +475,7 @@ See: https://github.com/facebook/metro/pull/1343`,
       {
         name: path.node.source.value,
         asyncType: null,
+        isESMImport: true,
         optional: false,
       },
       path,
@@ -481,6 +499,7 @@ function processImportCall(
     {
       name,
       asyncType: options.asyncType,
+      isESMImport: options.isESMImport,
       optional: isOptionalDependency(name, path, state),
     },
     path,
@@ -523,11 +542,21 @@ function processRequireCall(
     return;
   }
 
+  let isESMImport = false;
+  if (state.unstable_isESMImportAtSource) {
+    const isImport = state.unstable_isESMImportAtSource;
+    const loc = getNearestLocFromPath(path);
+    if (loc) {
+      isESMImport = isImport(loc);
+    }
+  }
+
   const dep = registerDependency(
     state,
     {
       name,
       asyncType: null,
+      isESMImport,
       optional: isOptionalDependency(name, path, state),
     },
     path,
@@ -555,6 +584,7 @@ function getNearestLocFromPath(path: NodePath<>): ?BabelSourceLocation {
 export type ImportQualifier = $ReadOnly<{
   name: string,
   asyncType: AsyncDependencyType | null,
+  isESMImport: boolean,
   optional: boolean,
   contextParams?: RequireContextParams,
 }>;
@@ -801,13 +831,16 @@ function createModuleNameLiteral(dependency: InternalDependency) {
 
 /**
  * Given an import qualifier, return a key used to register the dependency.
- * Generally this return the `ImportQualifier.name` property, but more
- * attributes can be appended to distinguish various combinations that would
- * otherwise conflict.
+ * Attributes can be appended to distinguish various combinations that would
+ * otherwise be considered the same dependency edge.
+ *
+ * For example, the following dependencies would collapse into a single edge
+ * if they simply utilized the `name` property:
  *
- * For example, the following case would have collision issues if they all utilized the `name` property:
  * ```
  * require('./foo');
+ * import foo from './foo'
+ * await import('./foo')
  * require.context('./foo');
  * require.context('./foo', true, /something/);
  * require.context('./foo', false, /something/);
@@ -817,14 +850,13 @@ function createModuleNameLiteral(dependency: InternalDependency) {
  * This method should be utilized by `registerDependency`.
  */
 function getKeyForDependency(qualifier: ImportQualifier): string {
-  let key = qualifier.name;
+  const {asyncType, contextParams, isESMImport, name} = qualifier;
 
-  const {asyncType} = qualifier;
-  if (asyncType) {
-    key += ['', asyncType].join('\0');
+  let key = [name, isESMImport ? 'import' : 'require'].join('\0');
+  if (asyncType != null) {
+    key += '\0' + asyncType;
   }
 
-  const {contextParams} = qualifier;
   // Add extra qualifiers when using `require.context` to prevent collisions.
   if (contextParams) {
     // NOTE(EvanBacon): Keep this synchronized with `RequireContextParams`, if any other properties are added
@@ -854,6 +886,7 @@ class DependencyRegistry {
       const newDependency: MutableInternalDependency = {
         name: qualifier.name,
         asyncType: qualifier.asyncType,
+        isESMImport: qualifier.isESMImport,
         locs: [],
         index: this._dependencies.size,
         key: crypto.createHash('sha1').update(key).digest('base64'),

package/src/ModuleGraph/worker/importLocationsPlugin.js

@@ -0,0 +1,51 @@
+"use strict";
+
+const invariant = require("invariant");
+function importLocationsPlugin({ types: t }) {
+  const importDeclarationLocs = new Set();
+  return {
+    visitor: {
+      ImportDeclaration(path) {
+        if (path.node.importKind !== "type" && path.node.loc != null) {
+          importDeclarationLocs.add(locToKey(path.node.loc));
+        }
+      },
+      ExportDeclaration(path) {
+        if (
+          path.node.source != null &&
+          path.node.exportKind !== "type" &&
+          path.node.loc != null
+        ) {
+          importDeclarationLocs.add(locToKey(path.node.loc));
+        }
+      },
+    },
+    pre: ({ path, metadata }) => {
+      invariant(
+        path && t.isProgram(path.node),
+        "path missing or not a program node"
+      );
+      const metroMetadata = metadata;
+      if (!metroMetadata.metro) {
+        metroMetadata.metro = {
+          unstable_importDeclarationLocs: importDeclarationLocs,
+        };
+      } else {
+        metroMetadata.metro.unstable_importDeclarationLocs =
+          importDeclarationLocs;
+      }
+    },
+  };
+}
+const MISSING_LOC = {
+  line: -1,
+  column: -1,
+};
+function locToKey(loc) {
+  const { start = MISSING_LOC, end = MISSING_LOC } = loc;
+  return `${start.line},${start.column}:${end.line},${end.column}`;
+}
+module.exports = {
+  importLocationsPlugin,
+  locToKey,
+};

package/src/ModuleGraph/worker/importLocationsPlugin.js.flow

@@ -0,0 +1,82 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @flow strict-local
+ * @format
+ * @oncall react_native
+ */
+
+'use strict';
+
+import type {PluginObj} from '@babel/core';
+import typeof * as Types from '@babel/types';
+import type {MetroBabelFileMetadata} from 'metro-babel-transformer';
+
+const invariant = require('invariant');
+
+type ImportDeclarationLocs = Set<string>;
+
+function importLocationsPlugin({types: t}: {types: Types, ...}): PluginObj<> {
+  const importDeclarationLocs: ImportDeclarationLocs = new Set();
+  return {
+    visitor: {
+      ImportDeclaration(path) {
+        if (
+          // Ignore type imports
+          path.node.importKind !== 'type' &&
+          // loc may not be set if this plugin runs alongside others which
+          // inject imports - eg Babel runtime helpers. We don't regard these
+          // as source import declarations.
+          path.node.loc != null
+        ) {
+          importDeclarationLocs.add(locToKey(path.node.loc));
+        }
+      },
+      ExportDeclaration(path) {
+        if (
+          // If `source` is set, this is a re-export, so it declares an ESM
+          // dependency.
+          path.node.source != null &&
+          // Ignore type exports
+          path.node.exportKind !== 'type' &&
+          // As above, ignore injected imports.
+          path.node.loc != null
+        ) {
+          importDeclarationLocs.add(locToKey(path.node.loc));
+        }
+      },
+    },
+    pre: ({path, metadata}) => {
+      invariant(
+        path && t.isProgram(path.node),
+        'path missing or not a program node',
+      );
+
+      // $FlowFixMe[prop-missing] Babel `File` is not generically typed
+      const metroMetadata: MetroBabelFileMetadata = metadata;
+
+      // Set the result on a metadata property
+      if (!metroMetadata.metro) {
+        metroMetadata.metro = {
+          unstable_importDeclarationLocs: importDeclarationLocs,
+        };
+      } else {
+        metroMetadata.metro.unstable_importDeclarationLocs =
+          importDeclarationLocs;
+      }
+    },
+  };
+}
+
+// Very simple serialisation of a source location. This should remain opaque to
+// the caller.
+const MISSING_LOC = {line: -1, column: -1};
+function locToKey(loc: BabelSourceLocation): string {
+  const {start = MISSING_LOC, end = MISSING_LOC} = loc;
+  return `${start.line},${start.column}:${end.line},${end.column}`;
+}
+
+module.exports = {importLocationsPlugin, locToKey};

package/src/Server.js

@@ -450,7 +450,7 @@ class Server {
     const depGraph = await this._bundler.getBundler().getDependencyGraph();
     const filePath = path.join(rootDir, relativePathname);
     try {
-      depGraph.getSha1(filePath);
+      await depGraph.getOrComputeSha1(filePath);
     } catch {
       res.writeHead(404);
       res.end();
@@ -1107,6 +1107,7 @@ class Server {
         key: filePath,
         locs: [],
         asyncType: null,
+        isESMImport: false,
       },
     }).filePath;
   }

package/src/Server.js.flow

@@ -630,7 +630,7 @@ class Server {
     const depGraph = await this._bundler.getBundler().getDependencyGraph();
     const filePath = path.join(rootDir, relativePathname);
     try {
-      depGraph.getSha1(filePath);
+      await depGraph.getOrComputeSha1(filePath);
     } catch {
       res.writeHead(404);
       res.end();
@@ -1420,7 +1420,7 @@ class Server {
         : this._config.projectRoot;
     return resolutionFn(`${rootDir}/.`, {
       name: filePath,
-      data: {key: filePath, locs: [], asyncType: null},
+      data: {key: filePath, locs: [], asyncType: null, isESMImport: false},
     }).filePath;
   }
 

package/src/node-haste/DependencyGraph/ModuleResolution.js

@@ -33,6 +33,7 @@ class ModuleResolver {
           data: {
             key: this._options.emptyModulePath,
             asyncType: null,
+            isESMImport: false,
             locs: [],
           },
         },
@@ -80,6 +81,7 @@ class ModuleResolver {
             doesFileExist,
             extraNodeModules,
             fileSystemLookup,
+            isESMImport: dependency.data.isESMImport,
             mainFields,
             nodeModulesPaths,
             preferNativePlatform,

package/src/node-haste/DependencyGraph/ModuleResolution.js.flow

@@ -118,6 +118,7 @@ class ModuleResolver<TPackage: Packageish> {
           data: {
             key: this._options.emptyModulePath,
             asyncType: null,
+            isESMImport: false,
             locs: [],
           },
         },
@@ -165,6 +166,7 @@ class ModuleResolver<TPackage: Packageish> {
             doesFileExist,
             extraNodeModules,
             fileSystemLookup,
+            isESMImport: dependency.data.isESMImport,
             mainFields,
             nodeModulesPaths,
             preferNativePlatform,

package/src/node-haste/DependencyGraph.d.ts

@@ -34,7 +34,7 @@ export default class DependencyGraph extends EventEmitter {
   ): Promise<DependencyGraph>;
 
   getAllFiles(): string[];
-  getSha1(filename: string): string;
+  getOrComputeSha1(filename: string): Promise<{sha1: string; content?: Buffer}>;
   getWatcher(): EventEmitter;
   end(): void;
 

package/src/node-haste/DependencyGraph.js

@@ -24,13 +24,6 @@ function getOrCreateMap(map, field) {
   }
   return subMap;
 }
-const missingSha1Error = (mixedPath) =>
-  new Error(`Failed to get the SHA-1 for: ${mixedPath}.
-  Potential causes:
-    1) The file is not watched. Ensure it is under the configured \`projectRoot\` or \`watchFolders\`.
-    2) Check \`blockList\` in your metro.config.js and make sure it isn't excluding the file path.
-    3) The file may have been deleted since it was resolved - try refreshing your app.
-    4) Otherwise, this is a bug in Metro or the configured resolver - please report it.`);
 class DependencyGraph extends EventEmitter {
   constructor(config, options) {
     super();
@@ -183,17 +176,15 @@ class DependencyGraph extends EventEmitter {
   getAllFiles() {
     return nullthrows(this._fileSystem).getAllFiles();
   }
-  getSha1(filename) {
-    const sha1 = this._fileSystem.getSha1(filename);
-    if (!sha1) {
-      throw missingSha1Error(filename);
-    }
-    return sha1;
-  }
-  async unstable_getOrComputeSha1(mixedPath) {
+  async getOrComputeSha1(mixedPath) {
     const result = await this._fileSystem.getOrComputeSha1(mixedPath);
     if (!result || !result.sha1) {
-      throw missingSha1Error(mixedPath);
+      throw new Error(`Failed to get the SHA-1 for: ${mixedPath}.
+      Potential causes:
+        1) The file is not watched. Ensure it is under the configured \`projectRoot\` or \`watchFolders\`.
+        2) Check \`blockList\` in your metro.config.js and make sure it isn't excluding the file path.
+        3) The file may have been deleted since it was resolved - try refreshing your app.
+        4) Otherwise, this is a bug in Metro or the configured resolver - please report it.`);
     }
     return result;
   }
@@ -232,7 +223,8 @@ class DependencyGraph extends EventEmitter {
     const resolverOptionsKey =
       JSON.stringify(resolverOptions ?? {}, canonicalize) ?? "";
     const originKey = isSensitiveToOriginFolder ? path.dirname(from) : "";
-    const targetKey = to;
+    const targetKey =
+      to + (dependency.data.isESMImport === true ? "\0esm" : "\0cjs");
     const platformKey = platform ?? NULL_PLATFORM;
     const mapByResolverOptions = this._resolutionCache;
     const mapByOrigin = getOrCreateMap(

package/src/node-haste/DependencyGraph.js.flow

@@ -55,14 +55,6 @@ function getOrCreateMap<T>(
   return subMap;
 }
 
-const missingSha1Error = (mixedPath: string) =>
-  new Error(`Failed to get the SHA-1 for: ${mixedPath}.
-  Potential causes:
-    1) The file is not watched. Ensure it is under the configured \`projectRoot\` or \`watchFolders\`.
-    2) Check \`blockList\` in your metro.config.js and make sure it isn't excluding the file path.
-    3) The file may have been deleted since it was resolved - try refreshing your app.
-    4) Otherwise, this is a bug in Metro or the configured resolver - please report it.`);
-
 class DependencyGraph extends EventEmitter {
   _config: ConfigT;
   _haste: MetroFileMap;
@@ -264,23 +256,20 @@ class DependencyGraph extends EventEmitter {
     return nullthrows(this._fileSystem).getAllFiles();
   }
 
-  getSha1(filename: string): string {
-    const sha1 = this._fileSystem.getSha1(filename);
-    if (!sha1) {
-      throw missingSha1Error(filename);
-    }
-    return sha1;
-  }
-
   /**
    * Used when watcher.unstable_lazySha1 is true
    */
-  async unstable_getOrComputeSha1(
+  async getOrComputeSha1(
     mixedPath: string,
   ): Promise<{content?: Buffer, sha1: string}> {
     const result = await this._fileSystem.getOrComputeSha1(mixedPath);
     if (!result || !result.sha1) {
-      throw missingSha1Error(mixedPath);
+      throw new Error(`Failed to get the SHA-1 for: ${mixedPath}.
+      Potential causes:
+        1) The file is not watched. Ensure it is under the configured \`projectRoot\` or \`watchFolders\`.
+        2) Check \`blockList\` in your metro.config.js and make sure it isn't excluding the file path.
+        3) The file may have been deleted since it was resolved - try refreshing your app.
+        4) Otherwise, this is a bug in Metro or the configured resolver - please report it.`);
     }
     return result;
   }
@@ -339,7 +328,8 @@ class DependencyGraph extends EventEmitter {
     const resolverOptionsKey =
       JSON.stringify(resolverOptions ?? {}, canonicalize) ?? '';
     const originKey = isSensitiveToOriginFolder ? path.dirname(from) : '';
-    const targetKey = to;
+    const targetKey =
+      to + (dependency.data.isESMImport === true ? '\0esm' : '\0cjs');
     const platformKey = platform ?? NULL_PLATFORM;
 
     // Traverse the resolver cache, which is a tree of maps