安装@apollo/client后无法解析主模块字段

Question

安装 Apollo 后，我在尝试运行我的 React Native Expo 应用程序时遇到错误。我尝试删除节点模块并重新安装、重置缓存、重新启动计算机，但仍然没有成功。

Android 捆绑失败 456ms 尝试@apollo/client从文件 >解析模块时，成功找到/mnt/c/Users/14044/Desktop/Coding/divii/client/App.tsx包 > >。/mnt/c/Users/14044/Desktop/Coding/divii/client/node_modules/@apollo/client/package.json然而，这个包本身指定了一个main模块字段>无法解析>( /mnt/c/Users/14044/Desktop/Coding/divii/client/node_modules/@apollo/client/main.cjs。事实上，这些文件都不存在：

• /mnt/c/Users/14044/Desktop/Coding/divii/client/node_modules/@apollo/client/main.cjs(.native|.android.jsx|.native.jsx|.jsx|.android.js|. native.js|.js|.android.ts|.native.ts|.ts|.android.tsx|.native.tsx|.tsx|.android.json|.native.json|.json)
• /mnt/c/Users/14044/Desktop/Coding/divii/client/node_modules/@apollo/client/main.cjs/index(.native|.android.jsx|.native.jsx|.jsx|.android.js |.native.js|.js|.android.ts|.native.ts|.ts|.android.tsx|.native.tsx|.tsx|.android.json|.native.json|.json)

Answer 1

这是 @apollo/client v3.5.4 和 RN Metro 捆绑器之间的冲突。

作为解决此问题之前的解决方法，您可以通过在 React Native 项目的根目录中创建一个Metro.config.js文件来配置 Metro，其中包含以下内容：

const { getDefaultConfig } = require("metro-config");
const { resolver: defaultResolver } = getDefaultConfig.getDefaultValues();
exports.resolver = {
  ...defaultResolver,
  sourceExts: [
    ...defaultResolver.sourceExts,
    "cjs",
  ],
};

此解决方法发布在 Apollo Github 发布页面 （此处）。

Answer 2

Apollo Client这是最新版本（3.5.0 及更高版本）和工作方式的问题Metro bundler。您需要配置 Metro 以了解通过在项目的根文件夹中创建的文件来了解.cjs所使用的文件。@apollo/clientmetro.config.js

Apollo以下是发布页面上解决方案的链接。

我尝试了该解决方案，它不起作用，错误已解决，但项目中其他包的构建中断了，所以我尝试了类似但不同的方法

这是我的metro.config.js

const {getDefaultConfig} = require('metro-config');

module.exports = (async () => {
  const {
    resolver: {sourceExts},
  } = await getDefaultConfig();
  return {
    transformer: {
      getTransformOptions: async () => ({
        transform: {
          experimentalImportSupport: false,
          inlineRequires: true,
        },
      }),
    },
    resolver: {
      sourceExts: [...sourceExts, 'cjs'],
    },
  };
})();

Answer 3

尝试降级到@apollo/client 3.4.16. 我刚刚做了一轮软件包更新，3.5.4也破坏了我的构建。我正在使用降级的软件包和graphqllib 的降级版本 - 15.7.2。

这些是对我来说适用于当前版本的 Expo / RN 的最新版本。

希望对您有所帮助！

Answer 4

对于使用 Expo 和新 Apollo 客户端的任何人，您应该将其更新metro.config.js为如下所示：

const { getDefaultConfig } = require('@expo/metro-config');

const defaultConfig = getDefaultConfig(__dirname);

defaultConfig.resolver.sourceExts.push('cjs');

module.exports = defaultConfig;

确保使用 expo Metro 配置默认值非常重要，否则 eas 会在构建时抱怨。