使用Jest测试含RNEUI组件的React Native项目遇错求助

这个错误一般是jest-expo与@jest/create-cache-key-function依赖版本不兼容导致的，结合你使用rneui:4.0.0-rc-6和@testing-library/react-native的场景，可以按以下步骤解决：

1. 对齐依赖版本 #

确保jest-expo和@jest/create-cache-key-function的版本匹配，比如使用jest-expo ~49.x时，对应@jest/create-cache-key-function ^29.x版本。在package.json中明确指定：

{
  "devDependencies": {
    "@jest/create-cache-key-function": "^29.7.0",
    "jest-expo": "~49.0.11"
  }
}

执行npm install或yarn install重新安装依赖，确保版本一致。

2. 自定义资源Transformer #

如果版本对齐后问题仍存在，替换jest-expo默认的assetFileTransformer：

• 在jest配置文件（jest.config.js）或package.json的jest字段中修改transform规则：

module.exports = {
  transform: {
    '^.+\\.(js|jsx|ts|tsx)$': 'babel-jest',
    '^.+\\.(png|jpg|jpeg|gif|svg)$': '<rootDir>/jestAssetTransformer.js'
  }
};

• 在项目根目录创建jestAssetTransformer.js文件，内容如下：

const { getCacheKey } = require('@jest/create-cache-key-function');

module.exports = {
  process(src, filename) {
    return `module.exports = ${JSON.stringify(filename)};`;
  },
  getCacheKey: getCacheKey([__filename])
};

3. 完善转译白名单配置 #

确保之前添加的transformIgnorePatterns包含所有需要转译的第三方库，因为你用到了Icon组件，需加入react-native-vector-icons：

{
  "jest": {
    "transformIgnorePatterns": [
      "node_modules/(?!(jest-)?react-native|@react-native|@rneui|react-native-vector-icons)"
    ]
  }
}

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