我无法在 React Native Expo 应用程序上加载@apollo/client

Question

我正在尝试在 React Native Expo 应用程序上加载@apollo/client。

我得到这个错误：

在尝试从文件/Users/andrepena/git/anglio-mobile-rn/screens/dictionary/index.tsx解析模块@apollo/client时， package /Users/andrepena/git/anglio-mobile-rn/node_modules/@apollo/client/package.json成功找到/Users/andrepena/git/anglio-mobile-rn/node_modules/@apollo/client/package.json 。 但是，这个 package 本身指定了一个无法解析的main模块字段（ /Users/andrepena/git/anglio-mobile-rn/node_modules/@apollo/client/main.cjs 。实际上，这些文件都不存在

然后我搜索了 Stackoverflow，有人说我应该将其添加到我的metro.config.json

const { getDefaultConfig } = require("@expo/metro-config");
const defaultConfig = getDefaultConfig(__dirname);
defaultConfig.resolver.assetExts.push("cjs");
module.exports = defaultConfig;

但是现在，所有来自 @apollo/client 的导入都只返回undefined 。

例子：

import { ApolloClient, InMemoryCache } from "@apollo/client";
console.log(ApolloClient); // undefined
console.log(InMemoryCache); // undefined

事实上， @apollo/client正在导出这个 object：

Object {
  "default": 17,
}

有什么建议吗？

Answer 1

这个metro.config.js对我有用：（记得安装@expo/metro-config ）

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

const config = getDefaultConfig(__dirname, {
    // Initialize in exotic mode.
    // If you want to preserve `react-native` resolver main field, and omit cjs support, then leave this undefined
    // and skip setting the `EXPO_USE_EXOTIC` environment variable.
    mode: 'exotic',
});

module.exports = config;

奇特的东西让 Metro 能够找到 @apollo/client 导出的奇怪的 cjs 模块