error Cannot read properties of undefined (reading 'transformFile'). TypeError: Cannot read properties of undefined (reading 'transformFile')

rahul-s-1110 commented 8 months ago

Hi I am using react native@0.64.4, it's an old project, but officially it's running My node version is v16.20.2 And I am using MacMini m2.

node /Volumes/DATA/LIVE_PROJECT/PROFIT1/GIT/profit/node_modules/react-native/cli.js bundle --entry-file index.js --platform ios --dev false --reset-cache --bundle-output /Users/rahul/Library/Developer/Xcode/DerivedData/Materio-dbycxrkcxmjlbldxktdffazgkcrc/Build/Intermediates.noindex/ArchiveIntermediates/Materio/BuildProductsPath/Release-iphoneos/main.jsbundle --assets-dest /Users/rahul/Library/Developer/Xcode/DerivedData/Materio-dbycxrkcxmjlbldxktdffazgkcrc/Build/Intermediates.noindex/ArchiveIntermediates/Materio/BuildProductsPath/Release-iphoneos/Profitapp warning: the transform cache was reset. Welcome to Metro! Fast - Scalable - Integrated

watchman warning: Recrawled this watch 33 times, most recently because: MustScanSubDirs UserDroppedTo resolve, please review the information on https://facebook.github.io/watchman/docs/troubleshooting.html#recrawl To clear this warning, run: watchman watch-del '/Volumes/DATA/LIVE_PROJECT/PROFIT1/GIT/profit' ; watchman watch-project '/Volumes/DATA/LIVE_PROJECT/PROFIT1/GIT/profit'

Recrawled this watch 33 times, most recently because: MustScanSubDirs UserDroppedTo resolve, please review the information on https://facebook.github.io/watchman/docs/troubleshooting.html#recrawl To clear this warning, run: watchman watch-del '/Volumes/DATA/LIVE_PROJECT/PROFIT1/GIT/profit' ; watchman watch-project '/Volumes/DATA/LIVE_PROJECT/PROFIT1/GIT/profit'

Failed to construct transformer: Error: error:0308010C:digital envelope routines::unsupported at new Hash (node:internal/crypto/hash:71:19) at Object.createHash (node:crypto:130:10) at stableHash (/Volumes/DATA/LIVE_PROJECT/PROFIT1/GIT/profit/node_modules/metro-cache/src/stableHash.js:19:8) at Object.getCacheKey (/Volumes/DATA/LIVE_PROJECT/PROFIT1/GIT/profit/node_modules/metro-transform-worker/src/index.js:647:7) at getTransformCacheKey (/Volumes/DATA/LIVE_PROJECT/PROFIT1/GIT/profit/node_modules/metro/src/DeltaBundler/getTransformCacheKey.js:32:19) at new Transformer (/Volumes/DATA/LIVE_PROJECT/PROFIT1/GIT/profit/node_modules/metro/src/DeltaBundler/Transformer.js:180:28) at /Volumes/DATA/LIVE_PROJECT/PROFIT1/GIT/profit/node_modules/metro/src/Bundler.js:58:29 at processTicksAndRejections (node:internal/process/task_queues:96:5) { 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 /Volumes/DATA/LIVE_PROJECT/PROFIT1/GIT/profit/node_modules/metro/src/Bundler.js:95:34 at Generator.next () at asyncGeneratorStep (/Volumes/DATA/LIVE_PROJECT/PROFIT1/GIT/profit/node_modules/metro/src/Bundler.js:14:24) at _next (/Volumes/DATA/LIVE_PROJECT/PROFIT1/GIT/profit/node_modules/metro/src/Bundler.js:36:9) at processTicksAndRejections (node:internal/process/task_queues:96:5) info Run CLI with --verbose flag for more details. Command PhaseScriptExecution failed with a nonzero exit code

I have reinstalled project several times, cleared node modes ,Pods,Drive data several time

I google tried to find solution although , there I found I have to add export NODE_OPTIONS=--openssl-legacy-provider in ~/.bashrc and ~/.zshrc, but it work only debug mode

but when I am trying to build from Xcode or I am trying to archive project for test flight I am getting previous error again

Can you help me to resolve this issue?

Here is my package.json's dependencies "dependencies": { "@react-native-async-storage/async-storage": "1.15.8", "@react-native-community/checkbox": "0.5.14", "@react-native-community/datetimepicker": "3.4.6", "@react-native-community/push-notification-ios": "1.10.1", "@react-native-firebase/app": "17.3.1", "@react-native-firebase/messaging": "17.3.1", "@react-native-masked-view/masked-view": "0.2.6", "@starlingtech/element": "0.2.2", "@starlingtech/image": "0.1.2", "axios": "1.5.1", "moment": "2.27.0", "react": "17.0.1", "react-native": "0.64.4", "react-native-animatable": "1.3.3", "react-native-appearance": "0.3.4", "react-native-background-timer": "2.4.1", "react-native-calendar-strip": "2.2.6", "react-native-calendars": "1.1284.0", "react-native-callkeep": "4.3.3", "react-native-custom-scroll-indicator": "1.0.8", "react-native-date-picker": "4.3.3", "react-native-device-info": "8.1.3", "react-native-dropdown-picker": "5.4.3", "react-native-element-dropdown": "2.1.0", "react-native-element-timer": "2.1.2", "react-native-flash-message": "0.4.2", "react-native-gesture-handler": "1.10.3", "react-native-htmlview": "0.16.0", "react-native-image-crop-picker": "0.33.4", "react-native-keyboard-accessory": "0.1.16", "react-native-keyboard-avoiding-scroll-view": "1.0.1", "react-native-keyboard-aware-scroll-view": "0.9.5", "react-native-keyboard-done-button": "1.0.0", "react-native-linear-gradient": "2.6.0", "react-native-material-menu": "2.0.0", "react-native-media-controls": "2.3.0", "react-native-mmkv": "2.5.1", "react-native-modal": "13.0.1", "react-native-number-ticker": "0.1.5", "react-native-orientation-locker": "1.5.0", "react-native-pell-rich-editor": "1.8.8", "react-native-permissions": "2.0.9", "react-native-push-notification": "8.1.1", "react-native-reanimated": "2.7.0", "react-native-remote-svg": "2.0.10", "react-native-safe-area-context": "3.2.0", "react-native-screens": "3.11.1", "react-native-shared-element": "0.7.0", "react-native-skeleton-placeholder": "5.0.0", "react-native-slider": "0.11.0", "react-native-sliders": "1.1.1", "react-native-splash-screen": "3.2.0", "react-native-svg": "13.14.0", "react-native-text-editor": "1.0.0", "react-native-timeline-flatlist": "0.8.0", "react-native-twilio-programmable-voice": "https://github.com/hoxfon/react-native-twilio-programmable-voice#feat/twilio-android-sdk-5", "react-native-version-check": "3.4.2", "react-native-video": "5.2.0", "react-native-webview": "11.4.2", "react-navigation": "4.4.0", "react-navigation-stack": "2.8.2", "react-query": "3.39.3", "zustand": "4.4.1" }, "devDependencies": { "@babel/core": "7.17.12", "@babel/runtime": "7.17.9", "@react-native-community/eslint-config": "3.0.2", "@rnx-kit/align-deps": "2.2.5", "@tsconfig/react-native": "3.0.2", "@types/jest": "29.5.5", "@types/react": "17", "@types/react-native": "0.64.2", "@types/react-native-video": "5.0.16", "@types/react-test-renderer": "18.0.2", "@typescript-eslint/eslint-plugin": "6.7.2", "@typescript-eslint/parser": "6.7.2", "babel-jest": "28.1.0", "babel-plugin-module-resolver": "5.0.0", "eslint": "8.0.1", "eslint-config-prettier": "9.0.0", "eslint-import-resolver-babel-module": "5.3.2", "eslint-plugin-import": "2.28.1", "eslint-plugin-jest": "27.4.0", "eslint-plugin-prettier": "5.0.0", "eslint-plugin-react": "7.33.2", "eslint-plugin-react-hooks": "4.6.0", "eslint-plugin-react-native": "4.1.0", "jest": "28.1.0", "metro-react-native-babel-preset": "0.70.3", "patch-package": "8.0.0", "prettier": "3.0.3", "react-test-renderer": "17.0.1", "reactotron-react-native": "5.0.3", "typescript": "5.2.2" },

robhogan commented 8 months ago

Hi @rahul-s-1110,

See https://github.com/facebook/metro/issues/1051 for some pointers on how to pass NODE_OPTIONS through Xcode and/or Gradle.

It's also possible you have multiple versions of Node.js installed (with NVM maybe?) and the Xcode environment is picking up a different one from your usual shell - you can try uninstalling anything Node 17 and above to prevent that. You shouldn't see E_OSSL_EVP_UNSUPPORTED if you're exclusively running Node 16.x.

Finally, you could use something like patch-package to apply this one-line fix to metro-cache, which is the cause of the error: https://github.com/facebook/metro/pull/752/files.

Beyond that, I'm afraid we can't offer support for versions as old as the one you're running - we release patches for the last two stable React Native releases, 0.71 and up. Stack Overflow might be a better place to troubleshoot older versions.

rahul-s-1110 commented 8 months ago

Thanks @robhogan . It's finally working with changing in metro-cache.

I understand that my project is using an older version of React Native, and I appreciate your recommendation. This project has been a long-standing legacy application, and I am in the process of planning and preparing for an upgrade to a more recent React Native version.

parnekov commented 4 months ago

Thanks @robhogan .

this works for me

diegola2 commented 4 months ago

Thanks @robhogan .

this works for me

This work for me.!! thanks

sonminh287 commented 4 months ago

Thanks @robhogan .

this works for me

I love you, you save my working weekdays

mochadwi commented 3 months ago

Hi @rahul-s-1110,

See #1051 for some pointers on how to pass NODE_OPTIONS through Xcode and/or Gradle.

It's also possible you have multiple versions of Node.js installed (with NVM maybe?) and the Xcode environment is picking up a different one from your usual shell - you can try uninstalling anything Node 17 and above to prevent that. You shouldn't see E_OSSL_EVP_UNSUPPORTED if you're exclusively running Node 16.x.

Finally, you could use something like patch-package to apply this one-line fix to metro-cache, which is the cause of the error: https://github.com/facebook/metro/pull/752/files.

Beyond that, I'm afraid we can't offer support for versions as old as the one you're running - we release patches for the last two stable React Native releases, 0.71 and up. Stack Overflow might be a better place to troubleshoot older versions.

This workaround also works for my side. In M2 Mac Mini, using nvm with multiple node version (16, 17 & 18)

facebook / metro

error Cannot read properties of undefined (reading 'transformFile'). TypeError: Cannot read properties of undefined (reading 'transformFile') #1205