React Native Android端构建失败：无法解析hoist-non-react-statics模块

解决方案 #

原因说明 #

你遇到的报错是因为你使用的React Native 0.64.3版本配套的Metro打包工具，默认没有将.cjs后缀的文件加入可解析的扩展名列表，即使hoist-non-react-statics包实际存在对应文件，Metro也无法识别。

具体操作步骤 #

• 先卸载手动安装的依赖，重置依赖树

  npm uninstall hoist-non-react-statics
  rm -rf node_modules package-lock.json
  npm install
  

• 修改项目根目录下的metro.config.js配置，将cjs加入可解析后缀列表
  如果你没有该文件，直接新建文件填入以下内容：

  const { getDefaultConfig } = require('metro-config');
  
  module.exports = (async () => {
    const defaultConfig = await getDefaultConfig();
    return {
      resolver: {
        ...defaultConfig.resolver,
        sourceExts: [...defaultConfig.resolver.sourceExts, 'cjs']
      }
    };
  })();
  

  如果你已有该配置文件，只需在resolver配置的sourceExts数组末尾追加'cjs'即可。
• 清除所有缓存后重启服务

  watchman watch-del-all
  npm start --reset-cache
  

• 重新编译运行Android端即可。

临时兜底方案 #

如果上述操作后仍然报错，可以手动修改node_modules/hoist-non-react-statics/package.json中的main字段，将其指向实际存在的文件。比如如果dist目录下存在的是hoist-non-react-statics.js，就将main字段修改为：

"main": "./dist/hoist-non-react-statics.js"

内容的提问来源于stack exchange，提问作者William