Ignoring packages during dependency resolution

Do you want to request a feature or report a bug? Question/feature

What is the current behavior?

We have a dependency which is built as a C library. In order to use and test this with our RN app, we have one package with our node bindings (node-dep) and another with our RN bindings (rn-dep). So our code looks like:

let dep = null
if (typeof navigator === 'undefined' || navigator.product !== 'ReactNative') {
    dep = require("node-dep")
} else {
    dep = require("rn-dep")
}

We blacklistRE this dependency because if it is discovered, you see this package itself specifies a main module field that could not be resolved, presumably because it is not a valid RN package.

The node version of the package is not needed when packaging for RN, but metro discovers the conditional code requiring it and complains that it can’t be found: error: bundling failed: Error: Unable to resolve module `node-dep` from `/home/omit/node_modules/other_dependency/file.js`: Module `node-dep` does not exist in the Haste module map or in these directories: /home/omit/node_modules

So either we blacklistRE the node package to exclude it, and it fails to be found (though not needed), or we do not blacklistRE and it fails to package because it’s not an RN package.

What is the expected behavior?

Is there a way to tell metro to simply ignore any require("node-dep") and just have the app crash at runtime if it were encountered? I’d like to be able to blacklist the package directory and just have metro skip it over. dynamicDepsInPackages does not seem helpful here.

Please provide your exact Metro configuration and mention your Metro, node, yarn/npm version and operating system.

metro.config.js:

const blacklist = require('metro-config/src/defaults/blacklist')
const blacklistRE = blacklist([/.*node-dep.*/])

module.exports = {
  resolver: {
    blacklistRE,
  },
  transformer: {
    getTransformOptions: async () => ({
      transform: {
        experimentalImportSupport: false,
        inlineRequires: false,
      },
    }),
  },
};

metro - 0.51.1 (determined by RN version)

yarn - 1.22.0

node - 10.17.0

OS - Linux

[nacho-carnicero]

I ended up finding a solution that works great for my use case and that would work for this one without having to do that funky obfuscation. This solution uses the resolveRequest option of the metro config in order to point to a dumb file for the dependencies that are problematic, and uses the normal resolver for the others. Make sure to add the packages you want to ignore to the blacklistedModules array.

To make it work add this to your metro.config.js file:

/**
 * Metro configuration for React Native
 * https://github.com/facebook/react-native
 *
 * @format
 */

const OriginalResolver = require("metro-resolver");
const path = require("path");

const blacklistedModules = ["https", "http", "zlib"];

module.exports = {
  resolver: {
    resolveRequest: (context, realModuleName, platform, moduleName) => {
      if (blacklistedModules.includes(moduleName)) {
        return {
          filePath: path.resolve(__dirname + "/src/shim-module.js"),
          type: "sourceFile"
        };
      } else {
        return OriginalResolver.resolve(
          { ...context, resolveRequest: undefined },
          moduleName,
          platform
        );
      }
    }
  }
};

In my case /src/shim-module.js is a file with this content:

/**
 * File that shims a module. See the file metro.config.js at the root
 */
module.exports = {};

Hope this helps!

[higleyc]

@Slapbox sure, like this:

let dep
if (typeof navigator === 'undefined' || navigator.product !== 'ReactNative') {
    let pname = ""
    let x = ["n", "o", "d", "e", "-", "d", "e", "p"]
    for (let i = 0; i < x.length; ++i) {
        pname += x[i];
    }
    dep = require(pname)
} else {
    dep = require('rn-dep')
}