Expo开发React Native项目：superjson直接导入失败的原因及解决方法求助

问题原因 #

superjson的package.json入口配置（如main、module、exports字段）未适配Expo的Metro打包器模块解析规则，导致Metro无法识别默认入口路径；而直接指定dist/index时，能直接定位到编译后的可执行文件，因此可以正常导入。Metro对ES模块/CommonJS的解析逻辑与Node.js、webpack存在差异，若superjson默认入口未覆盖React Native场景，就会出现解析失败。

解决步骤 #

• 检查superjson的package.json配置
  进入项目node_modules/superjson目录查看package.json，确认main、module或exports字段是否包含适配React Native的入口定义。若仅针对Node.js或web环境配置，Metro会无法找到正确入口。

• 配置Metro resolver指定superjson入口
  在项目根目录的metro.config.js中添加自定义解析规则，让Metro解析superjson时直接指向正确的文件路径：

  const { getDefaultConfig } = require('expo/metro-config');
  
  const config = getDefaultConfig(__dirname);
  
  config.resolver.resolveRequest = (context, moduleName, platform) => {
    if (moduleName === 'superjson') {
      return {
        filePath: require.resolve('superjson/dist/index.js'),
        type: 'sourceFile',
      };
    }
    return context.resolveRequest(context, moduleName, platform);
  };
  
  module.exports = config;
  

  配置完成后，即可正常使用import SuperJSON from "superjson"导入。

• 清除缓存重启Metro
  执行命令清除Expo和Metro的缓存，避免缓存导致的模块解析异常：

  npx expo start --clear
  

• 升级superjson版本
  旧版本可能存在适配缺陷，尝试升级到最新版本：

  yarn upgrade superjson
  

  新版本大概率已修复React Native/Expo的模块解析问题。

内容的提问来源于stack exchange，提问作者Arash Jahan Bakhshan