将 react-native 模块列入黑名单不起作用

Question

我有一个项目文件夹，其中包含在 React 和 React-native 上开发的 Web 和移动应用程序，有一个 web 依赖项，它在 postinstall 脚本中添加了 SymLink，我面临的问题是 React-native Packager 服务器也选择启动该符号链接并且应用程序无法正常工作。 起初我关注了这个-how to make react native packager ignore certain directories，但 getBlacklistRE 默默地忽略了我通过的任何正则表达式。

编辑 这是我面临的实际问题，我已经尝试实施那里提到的所有解决方案，但还没有成功。 - https://github.com/facebook/react-native/issues/19763

EDIT2 现在在我看来，黑名单不起作用，它也可能由于我在 web 中使用的 babel 版本与下面的 React Native 之间的冲突而发生，即我的 package.json

Answer 1

你提到尝试黑名单没有运气。我没有并排的 web 和 react native 项目，但我确实有一个嵌套在我的 react native 项目中的 web 项目，所以这可能会有所帮助。黑名单确实对我有用，这就是它的实施方式。

在 rn-cli.config.js 中

const blacklist = require('metro/src/blacklist');

module.exports = {
  getTransformModulePath() {
    return require.resolve('./customTransformer'); // More on this below
  },

  getBlacklistRE() {
    return blacklist([
      /apps\/.*/,
    ]);
  },
};

我的项目根目录中有一个名为 apps/ 的目录。在应用程序内部/我有相当于 React Native 的 UI Explorer（一个嵌套的 React Native 应用程序）和 Web 文档（React Web 应用程序）。通过将此目录列入黑名单，我项目根目录下的 react native 打包程序将不会加载这些节点模块，否则会出现不必要的冲突。

customTransformer 在这里可能没有直接帮助，但我将其包括在内，以防它帮助您解决问题。我用它来用一个空对象替换本地模拟数据文件，这样我的最终构建就会删除模拟数据。如果您不知道，可能有一种方法可以帮助您完成项目。

// Note transformer was renamed to reactNativeTransformer effective in RN 0.56.x
const upstreamTransformer = require('metro/src/reactNativeTransformer');

module.exports.transform = function (input) {
  const { filename, options, src } = input;
  let newSrc = src;
  if (filename.indexOf('mocks') > -1 && !options.dev) {
    newSrc = 'module.exports = {}';
  }
  return upstreamTransformer.transform({ src: newSrc, filename, options });
};