无法解决 Macbook M1 上 React Native 应用程序中的资产模块 Metro 捆绑包错误答案

【问题标题】：Unable to resolve assets module metro bundle error in React Native app on Macbook M1无法解决 Macbook M1 上 React Native 应用程序中的资产模块 Metro 捆绑包错误
【发布时间】：2022-11-15 20:40:01
【问题描述】：

使用 metro metro.config.js 在 Macbook M1 上启动 React Native 应用程序：

const {getDefaultConfig} = require("metro-config")

module.exports = (async () => {
  const {
    resolver: {sourceExts, assetExts},
  } = await getDefaultConfig()
  return {
    transformer: {
      getTransformOptions: async () => ({
        transform: {
          experimentalImportSupport: false,
          inlineRequires: true,
        },
      }),
      babelTransformerPath: require.resolve("react-native-svg-transformer"),
    },
    resolver: {
      assetExts: assetExts.filter(ext => ext !== "svg"),
      sourceExts: [...sourceExts, "svg"],
    },
  }
})()

我的应用程序结构：

Root
  |--app
      |--assets
      |    |--icons
      |
      |--components
              |--tab
                  |-tab.tsx

从 assets 文件夹中导入 tab.tsx 文件中的图标，如下所示：

import CloseIcon from "assets/icons/close-icon.svg"

得到错误：

错误：错误：无法从根目录/app/components/tab/navigation/tab.tsx 解析模块 assets/icons/close-icon.svg：在项目或项目中找不到 assets/icons/close-icon.svg这些目录：节点模块 ../../node_modules

我试图清除缓存：

但这对我没有帮助。有时只有一步可以帮助我 - 关闭所有应用程序并重新启动我的笔记本电脑。并且错误消失了一段时间，但之后又一次又一次地出现。你能推荐我如何解决它吗？

【问题讨论】：

标签： react-native svg compiler-errors icons metro-bundler

【解决方案1】：

在我的情况下，这个错误每天都在 Mac M1 上发生，只有一个决定是使用下一个命令重新启动 Metro bundler：

npm start -- --reset-cache

【讨论】：