React-native 捆绑失败。错误信息："While trying to resolve module 'idb'..... Indeed none of these files exist"：

Question

有问题的错误消息：

尝试从文件 C:\Users\OG\Desktop\programming\react_native\mealstogo\MealsToGo2\node_modules\@firebase\app\dist\esm\index.esm2017.js 解析模块 idb 时，已成功找到包 C:\Users\OG\Desktop\programming\react_native\mealstogo\MealsToGo2\node_modules\idb\package.json。但是，这个包本身指定了一个无法解析的 main 模块字段（C:\Users\OG\Desktop\programming\react_native\mealstogo\MealsToGo2\node_modules\idb\build\index.cjs。实际上，存在 none 这些文件：

Error message photo

此错误令人困惑的部分是文件 index.esm2017 实际上确实存在于该目录中。 '`C:\Users\OG\Desktop\programming\react_native\mealstogo\MealsToGo2\node_modules\idb\build\index.cjs'

我已经卸载并重新安装了 firebase。我已经安装和卸载了 'idb'。我已经清除了 yarn 缓存、expo 缓存、删除 node_modules 并重新安装以及清除 watchman 缓存，但都无济于事。我还三重检查了文件目录实际上在错误消息中说它不在的位置。

expo 安装 lottie-react-native 时出现错误，但似乎无关，并且在删除 lottie-react-native 后问题仍然存在。我已经使用 git 将我的代码恢复到行为开始之前的状态，现在问题仍然存在。

看来整个项目现在都变成垃圾了，我该如何前进。

Answer 1

我遇到同样的错误...我认为新的 firebase 版本有些有趣。我将我的 firebase 版本降级到 9.6.11 以暂时解决这个问题...

npm uninstall firebase
npm install firebase@9.6.11

Answer 2

即使在一个干净的 expo 项目中添加 firebase 后也有完全相同的问题。问题是由于 .cjs 在 expo 中不受支持。

我修好了通过将 cjs 添加到 metro.config.js 中，如下所述：https://github.com/thysultan/stylis/issues/233#issuecomment-1000648356

Answer 3

如果您使用的是 expo，要解决此问题，请在项目根目录中创建一个 metro.config.js 文件。在文件中添加文件扩展名 cjs。 details

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

const defaultConfig = getDefaultConfig(__dirname);

defaultConfig.resolver.assetExts.push("cjs");

module.exports = defaultConfig;

ScreenShot

React Native 客户端

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

Answer 4

我刚刚将以下代码添加到 metro.config.js 文件中。我正在使用 Firebase v9.8.1

module.exports = {
  transformer: {
    getTransformOptions: async () => ({
      transform: {
        experimentalImportSupport: false,
        inlineRequires: true,
      },
    }),
  },
  //added this
  resolver: {
    sourceExts: ['jsx', 'js', 'ts', 'tsx', 'cjs'],
  },
};

Answer 5

我有一个 react-native 项目（没有 expo）并且得到了同样的错误，在我的情况下我有 firebase 9.7.0，但我像这个线程中的好友一样更改为 9.6.11 并且它作品。我使用 yarn install 和 npx pod-install 构建节点模块。这是我之前和之后的 package.json（只是更改了 firebase）

之后：

"dependencies": {
"@react-navigation/native": "^6.0.10",
"@react-navigation/stack": "^6.2.1",
"axios": "^0.27.2",
"firebase": "9.7.0",
"react": "17.0.2",
"react-native": "0.68.1",
"react-native-gesture-handler": "^2.4.1",
"react-native-safe-area-context": "^4.2.5",
"react-native-screens": "^3.13.1"

},

之前：（有效）：

"dependencies": {
"@react-navigation/native": "^6.0.10",
"@react-navigation/stack": "^6.2.1",
"axios": "^0.27.2",
"firebase": "9.6.11",
"react": "17.0.2",
"react-native": "0.68.1",
"react-native-gesture-handler": "^2.4.1",
"react-native-safe-area-context": "^4.2.5",
"react-native-screens": "^3.13.1"

},

Answer 6

发现这个在重新启动地铁捆绑器后有效： https://github.com/thysultan/stylis/issues/233

对于 Expo，您必须更改 app.json 文件：

{
  "expo": {
    ..., 
    "packagerOpts": {
      "sourceExts": ["cjs"]
    }
}

React-native 捆绑失败。错误信息："While trying to resolve module 'idb'..... Indeed none of these files exist"：

React-native bundling failure. ERROR MESSAGE: "While trying to resolve module 'idb'..... Indeed none of these files exist":

reactjs

firebase

react-native

expo

indexeddb