React Native iOS归档构建失败：transformFile未定义及脚本执行错误

问题描述 #

React Native项目在Android端和iOS调试模式下运行正常，但执行iOS归档构建时失败，抛出TypeError: Cannot read properties of undefined (reading 'transformFile')错误，同时提示Command PhaseScriptExecution failed with a nonzero exit code，错误栈显示存在ERR_OSSL_EVP_UNSUPPORTED的OpenSSL兼容问题。

环境配置 #

OS: macOS 14.0
Node: 21.5.0 - /usr/local/bin/node
Yarn: 1.22.19 - /opt/homebrew/bin/yarn
npm: 10.2.4 - /usr/local/bin/npm
CocoaPods: 1.14.3 - /usr/local/bin/pod
react: 17.0.2 => 17.0.2 
react-native: 0.66.1 => 0.66.1 

完整错误信息 #

Failed to construct transformer:  Error: error:0308010C:digital envelope routines::unsupported
    at new Hash (node:internal/crypto/hash:68:19)
    at Object.createHash (node:crypto:138:10)
    at stableHash (/Users/vishal/Work/RN_Project/HOST/host-react-native/node_modules/@react-native-community/cli-plugin-metro/node_modules/metro-cache/src/stableHash.js:19:8)
    at Object.getCacheKey (/Users/vishal/Work/RN_Project/HOST/host-react-native/node_modules/@react-native-community/cli-plugin-metro/node_modules/metro-transform-worker/src/index.js:593:7)
    at getTransformCacheKey (/Users/vishal/Work/RN_Project/HOST/host-react-native/node_modules/@react-native-community/cli-plugin-metro/node_modules/metro/src/DeltaBundler/getTransformCacheKey.js:24:19)
    at new Transformer (/Users/vishal/Work/RN_Project/HOST/host-react-native/node_modules/@react-native-community/cli-plugin-metro/node_modules/metro/src/DeltaBundler/Transformer.js:48:9)
    at /Users/vishal/Work/RN_Project/HOST/host-react-native/node_modules/@react-native-community/cli-plugin-metro/node_modules/metro/src/Bundler.js:22:29 {
  opensslErrorStack: [ 'error:03000086:digital envelope routines::initialization error' ],
  library: 'digital envelope routines',
  reason: 'unsupported',
  code: 'ERR_OSSL_EVP_UNSUPPORTED'
}
error Cannot read properties of undefined (reading 'transformFile').
TypeError: Cannot read properties of undefined (reading 'transformFile')
    at Bundler.transformFile (/Users/vishal/Work/RN_Project/HOST/host-react-native/node_modules/@react-native-community/cli-plugin-metro/node_modules/metro/src/Bundler.js:48:30)
    at async Object.transform (/Users/vishal/Work/RN_Project/HOST/host-react-native/node_modules/@react-native-community/cli-plugin-metro/node_modules/metro/src/lib/transformHelpers.js:101:12)
    at async processModule (/Users/vishal/Work/RN_Project/HOST/host-react-native/node_modules/@react-native-community/cli-plugin-metro/node_modules/metro/src/DeltaBundler/traverseDependencies.js:137:18)
    at async traverseDependenciesForSingleFile (/Users/vishal/Work/RN_Project/HOST/host-react-native/node_modules/@react-native-community/cli-plugin-metro/node_modules/metro/src/DeltaBundler/traverseDependencies.js:131:3)
    at async Promise.all (index 0)
    at async initialTraverseDependencies (/Users/vishal/Work/RN_Project/HOST/host-react-native/node_modules/@react-native-community/cli-plugin-metro/node_modules/metro/src/DeltaBundler/traverseDependencies.js:114:3)
    at async DeltaCalculator._getChangedDependencies (/Users/vishal/Work/RN_Project/HOST/host-react-native/node_modules/@react-native-community/cli-plugin-metro/node_modules/metro/src/DeltaBundler/DeltaCalculator.js:164:25)
    at async DeltaCalculator.getDelta (/Users/vishal/Work/RN_Project/HOST/host-react-native/node_modules/@react-native-community/cli-plugin-metro/node_modules/metro/src/DeltaBundler/DeltaCalculator.js:94:16)
    at async DeltaBundler.buildGraph (/Users/vishal/Work/RN_Project/HOST/host-react-native/node_modules/@react-native-community/cli-plugin-metro/node_modules/metro/src/DeltaBundler.js:50:5)
    at async IncrementalBundler.buildGraphForEntries (/Users/vishal/Work/RN_Project/HOST/host-react-native/node_modules/@react-native-community/cli-plugin-metro/node_modules/metro/src/IncrementalBundler.js:80:19)
info Run CLI with --verbose flag for more details.
Command PhaseScriptExecution failed with a nonzero exit code

metro.config.js配置 #

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

已尝试的解决方案 #

• export NODE_OPTIONS=--openssl-legacy-provider
• nvm unalias default
• 多次删除node_modules后重新构建
• 多次更新CocoaPods及Pods

有效解决方案 #

1. 降级Node版本至项目兼容范围 #

React Native 0.66.x版本官方推荐使用Node.js 14.x或16.x LTS版本，当前使用的Node 21.x版本过高，存在兼容性问题。使用nvm切换版本：

# 安装Node 16.x LTS版本
nvm install 16.20.2
# 切换到该版本
nvm use 16.20.2
# 设置为默认版本，避免终端重启后切换回去
nvm alias default 16.20.2

之后清理依赖并重新安装：

rm -rf node_modules yarn.lock package-lock.json
yarn install # 或 npm install
cd ios && pod install && cd ..

2. 确保归档时NODE_OPTIONS环境变量生效 #

Xcode归档时不会继承终端的环境变量，需在Xcode中配置：

• 打开Xcode，进入项目的Build Phases
• 找到Bundle React Native code and images脚本阶段
• 在脚本开头添加：

  export NODE_OPTIONS="--openssl-legacy-provider"
  

也可以修改package.json中的脚本，直接通过命令执行归档：

"scripts": {
  "ios:archive": "NODE_OPTIONS=--openssl-legacy-provider xcodebuild -workspace ios/YourProject.xcworkspace -scheme YourProject -configuration Release archive -archivePath ./build/YourProject.xcarchive"
}

执行归档命令：

yarn ios:archive

3. 检查react-native-svg-transformer版本兼容性 #

确保react-native-svg-transformer版本与React Native 0.66.1匹配，安装兼容版本：

yarn add react-native-svg-transformer@0.14.3 --dev

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