React Native无法添加自定义资源，metro.config.js被忽略。

Question

我正在尝试使用自定义资源来配置React Native应用程序，以下是我的配置信息：

"dependencies": {
    "glob": "^7.1.4",
    "metro-config": "latest",
    "react": "16.8.6",
    "react-native": "0.60.5",
    "react-native-camera": "git+https://[e-mail]/react-native-community/react-native-camera",
    "react-native-easy-toast": "^1.2.0",
    "react-native-fs": "^2.14.1",
    "react-native-svg": "^9.8.4",
    "react-native-tensorflow": "^0.1.8",
    "res": "^0.4.0",
    "rn-fetch-blob": "github:joltup/rn-fetch-blob#master",
    "tflite-react-native": "0.0.5",
    "util": "^0.12.1"
  },

我故意在 metro.config.js 和 react-native.config.js 中声明模块仅使用我的自定义扩展，如下所示：

（保留html标签）

module.exports = {
  project: {
    ios: {},
    android: {},
  },
  assets: [
    './src/assets/icons',
    './src/assets/svg',
    './src/assets/ai',
  ],
  assetExts: [
    ".xml", ".png", ".jpg", ".pb", ".tflite"
  ]
};

但是信息仍然是相同的：

error: bundling failed: Error: Unable to resolve module `./ai/annotations/Part1.xml` from 
`...src/assets/default-assets.js`: The module `./ai/annotations/Part1.xml` could not be found from 
`.../src/assets/default-assets.js`. Indeed, none of these files exist:
  * `.../src/assets/ai/annotations/Part1.xml(.native||.android.js|.native.js|.js|.android.json|.native.json|.json|.android.ts|.native.ts|.ts|.android.tsx|.native.tsx|.tsx)`

因此，metro.config.js和react-native.config.js显然被忽略了。

更新： 在尝试使用最新依赖项创建全新的React Native应用程序时，会出现验证消息：

● Validation Warning:

  Unknown option "assets" with value ["./src/assets/ai"] was found.
  This is probably a typing mistake. Fixing it will remove this message.

● Validation Warning:

  Unknown option "assetExts" with value [".xml", ".png", ".jpg", ".pb", ".tflite"] was found.
  This is probably a typing mistake. Fixing it will remove this message.

更新2： 我创建了一个仓库，展示了这个问题，并且提供了一个不起作用的解决方案建议（使用app.json而不是metro.config.js或react-native.config.js）在一个单独的分支上。你可以在这里找到它：

https://github.com/Macilias/ReactNativeAssetFail

- Macilias

---

顺便提一句，将相同的模块导出（包括assetExts）添加到react-native.config.js中也没有任何帮助。 - undefined

Answer 1

更新，我通过像这样从app.json指向metro.config.js来解决了错误：

{
  "name": "reactNativeTestapp",
  "displayName": "reactNativeTestapp",
  "packagerOpts": {
    "config": "metro.config.js"
  }
}

而 metro.config.js 的内容如下：

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

module.exports = (async () => {
  const {
    resolver: {sourceExts, assetExts},
  } = await getDefaultConfig();
  return {
    resolver: {
      assetExts: [assetExts, 'txt', 'xml', 'png', 'jpg', 'pb', 'tflite'],
      sourceExts: [...sourceExts, 'txt', 'xml', 'png', 'jpg', 'pb', 'tflite'],
    },
  };
})();

然而，XML文件的内容在App.js表单中没有显示出来，它只打印了一个数字，可能对应于行数？但是我该如何实际访问文件的内容呢？

- Macilias

Answer 2

尝试将它们添加到具有相同结构的react-native.config.js文件中。我的文件看起来像这样：

module.exports = {
    assets: ["./app/assets/fonts"]
}

不要忘记清理并运行。

- Bader Serhan