关于react-native:ReactNative中metro构建缓存导致的事故

最近一次应用 react-native 进行构建时呈现因 metro 构建缓存导致的事变。

事件的起因是这样的，在 babel.config.js 中引入babel-plugin-root-import

  plugins: [
    [
        "babel-plugin-root-import",
        {
            "rootPathSuffix": "src/",
            "rootPathPrefix": "@"
        }
    ]
]

而后，因为 @符号与 npm 中的一起包名抵触，像

import {createBottomTabNavigator} from '@react-navigation/bottom-tabs'

会呈现找不到 无奈导入 ’@react-navigation/bottom-tabs’的问题，问题很容易就找到起因所在，因而将 "rootPathPrefix": "@" 改成 "rootPathPrefix": "~".
然而问题并无奈解决，在运行时还是呈现 无奈导入 ’@react-navigation/bottom-tabs’.
就算是禁用 "babel-plugin-root-import" 也无奈导入。

应该缓存导致的问题，因为构建打包采纳的是 metro，因而查问了一下文档，通过resetCache 解决了这个问题。

// metro.config.js
module.exports = {
  resetCache:true,     // 减少这一行
  ...
}

resetCache=true的作用是每次构建时均清空缓存，其默认是 false，能够放慢构建速度。
然而在某些状况下会呈现因缓存导致的问题。

论断：

当在运行 React-Native 呈现一些问题时，能够尝试通过清空缓存来解决。

• 进入 android 文件夹，运行gradlew clean，清空 android 构建缓存。
• 配置 metro.config.js 文件中的resetCache=true, 清空打构建缓存