react-native
react-native copied to clipboard
Invariant Violation: Failed to call into JavaScript module method AppRegistry.runApplication(). When Upgrading To React Native v0.70
Description
Upgrade from 0.68.1 to 0.70.0. Builds fine in Xcode. Launches Simulator. Splash screen for app appears.
and then it crashes with the error:
ERROR Invariant Violation: Failed to call into JavaScript module method AppRegistry.runApplication(). Module has not been registered as callable. Registered callable JavaScript modules (n = 11): Systrace, JSTimers, HeapCapture, SamplingProfiler, RCTLog, RCTDeviceEventEmitter, RCTNativeAppEventEmitter, GlobalPerformanceLogger, JSDevSupportModule, HMRClient, RCTEventEmitter. A frequent cause of the error is that the application entry file path is incorrect. This can also happen when the JS bundle is corrupt or there is an early initialization error when loading React Native., js engine: hermes
Version
0.70.0
Output of npx react-native info
ystem: OS: macOS 12.3.1 CPU: (4) x64 Intel(R) Core(TM) i7-4578U CPU @ 3.00GHz Memory: 1.20 GB / 16.00 GB Shell: 3.2.57 - /bin/bash Binaries: Node: 16.15.0 - /usr/local/bin/node Yarn: Not Found npm: 8.5.5 - /usr/local/bin/npm Watchman: 2022.03.21.00 - /usr/local/bin/watchman Managers: CocoaPods: 1.11.3 - /usr/local/bin/pod SDKs: iOS SDK: Platforms: DriverKit 21.4, iOS 15.5, macOS 12.3, tvOS 15.4, watchOS 8.5 Android SDK: Not Found IDEs: Android Studio: Not Found Xcode: 13.4.1/13F100 - /usr/bin/xcodebuild Languages: Java: Not Found npmPackages: @react-native-community/cli: Not Found react: Not Found react-native: Not Found react-native-macos: Not Found npmGlobalPackages: react-native: Not Found
Steps to reproduce
Upgrade from 0.68.1 to 0.70.0. Builds fine in Xcode. Launches Simulator. Splash screen for app appears.
and then it crashes with the error:
ERROR Invariant Violation: Failed to call into JavaScript module method AppRegistry.runApplication(). Module has not been registered as callable. Registered callable JavaScript modules (n = 11): Systrace, JSTimers, HeapCapture, SamplingProfiler, RCTLog, RCTDeviceEventEmitter, RCTNativeAppEventEmitter, GlobalPerformanceLogger, JSDevSupportModule, HMRClient, RCTEventEmitter. A frequent cause of the error is that the application entry file path is incorrect. This can also happen when the JS bundle is corrupt or there is an early initialization error when loading React Native., js engine: hermes
Snack, code example, screenshot, or link to a repository

i have the same issue
i have the same issue too
+1
Same here too
I succeed to avoid this error. In my case, it was due to the react-native-gesture-handler that changed.
Previously we needed to import it at the top of the root file, now we must do that in App.js instead
import { GestureHandlerRootView } from 'react-native-gesture-handler';
/* ... */
// Wrap your app with the new GestureHandler
<GestureHandlerRootView style={{ flex: 1 }}>
/* your app */
</GestureHandlerRootView>
Hope it will help
i have the same issue too
Also having this issue
In my case it was ViewPropTypes from react-native-camera, I've applied this patch:
diff --git a/node_modules/react-native-camera/src/RNCamera.js b/node_modules/react-native-camera/src/RNCamera.js
index b7a271a..bf729e6 100644
--- a/node_modules/react-native-camera/src/RNCamera.js
+++ b/node_modules/react-native-camera/src/RNCamera.js
@@ -1,11 +1,11 @@
// @flow
import React from 'react';
import PropTypes from 'prop-types';
+import {ViewPropTypes} from 'deprecated-react-native-prop-types';
import {
findNodeHandle,
Platform,
NativeModules,
- ViewPropTypes,
requireNativeComponent,
View,
ActivityIndicator,
and the error went away, note that I hade to manually install: yarn add deprecated-react-native-prop-types.
The error you have above is incomplete, you're missing this important part:
TypeError: undefined is not an object (evaluating '_reactnative.Text.propTypes.style')
I succeed to avoid this error. In my case, it was due to the react-native-gesture-handler that changed.
Previously we needed to import it at the top of the root file, now we must do that in App.js instead
import { GestureHandlerRootView } from 'react-native-gesture-handler'; /* ... */ // Wrap your app with the new GestureHandler <GestureHandlerRootView style={{ flex: 1 }}> /* your app */ </GestureHandlerRootView>Hope it will help
Not worked for me.
Any update on the same ? react-native-bot
I found that, similar to the OP, I had an error listed above the 'Invariant Violation: Failed to call into JavaScript module method AppRegistry.runApplication().'. (In my case, the error was "Invariant Violation: ViewPropTypes has been removed from React Native", which was caused by two libraries in the node_modules folder). When I fixed that error (by applying patches to those libraries), the two 'AppRegistry' errors disappeared as well.
any update on the issues?
Same issue here after upgrading all of dependencies my old project with yarn yarn yarn-upgrade-all

my package.json:
{
"name": "-",
"version": "0.0.1",
"osmiVersion": "1.1.0",
"private": true,
"scripts": {
"android": "react-native run-android",
"ios": "react-native run-ios",
"start": "react-native start --reset-cache",
"test": "jest",
"lint": "eslint .",
"format": "prettier --check ./App"
},
"dependencies": {
"@fortawesome/fontawesome-svg-core": "^6.2.0",
"@fortawesome/free-brands-svg-icons": "^6.2.0",
"@fortawesome/free-regular-svg-icons": "^6.2.0",
"@fortawesome/pro-light-svg-icons": "^6.2.0",
"@fortawesome/pro-regular-svg-icons": "^6.2.0",
"@fortawesome/pro-solid-svg-icons": "^6.2.0",
"@fortawesome/react-native-fontawesome": "^0.3.0",
"@monterosa/react-native-parallax-scroll": "^1.8.0",
"@react-native-async-storage/async-storage": "^1.17.10",
"@react-native-community/datetimepicker": "^6.3.4",
"@react-native-community/masked-view": "^0.1.11",
"@react-native-firebase/analytics": "^15.6.0",
"@react-native-firebase/app": "^15.6.0",
"@react-native-firebase/messaging": "^15.6.0",
"@react-native-firebase/perf": "^15.6.0",
"@react-navigation/bottom-tabs": "^6.4.0",
"@react-navigation/drawer": "^6.5.0",
"@react-navigation/native": "^6.0.13",
"@react-navigation/stack": "^6.3.1",
"@sentry/react-native": "5.0.0-alpha.1",
"add": "^2.0.6",
"apisauce": "^2.1.6",
"dayjs": "^1.11.5",
"enzyme": "^3.11.0",
"enzyme-adapter-react-16": "^1.15.6",
"formik": "^2.2.9",
"lodash": "^4.17.21",
"osmicsx": "^0.6.10",
"prop-types": "^15.8.1",
"ramda": "^0.28.0",
"react": "^18.2.0",
"react-native": "^0.70.1",
"react-native-animatable": "^1.3.3",
"react-native-autoheight-webview": "^1.6.4",
"react-native-background-downloader": "^2.3.4",
"react-native-config": "^1.4.6",
"react-native-device-info": "^10.2.0",
"react-native-dropdown-picker": "^5.4.2",
"react-native-fast-image": "^8.6.1",
"react-native-file-viewer": "^2.1.5",
"react-native-fluid-transitions": "^0.1.1",
"react-native-gallery-swiper": "^1.26.4",
"react-native-geolocation-service": "^5.3.0",
"react-native-gesture-handler": "^2.6.1",
"react-native-image-crop-picker": "^0.38.0",
"react-native-intl-phone-input": "^1.2.27",
"react-native-keyboard-spacer": "^0.4.1",
"react-native-linear-gradient": "^2.6.2",
"react-native-localize": "^2.2.3",
"react-native-modal": "^13.0.1",
"react-native-modal-datetime-picker": "^14.0.0",
"react-native-modal-selector": "^2.1.1",
"react-native-multiple-select": "^0.5.11",
"react-native-parallax-scroll-view": "^0.21.3",
"react-native-passkit-wallet": "^0.1.6",
"react-native-reanimated": "^2.10.0",
"react-native-render-html": "^6.3.4",
"react-native-safe-area-context": "^4.3.4",
"react-native-safe-area-view": "^1.1.1",
"react-native-screens": "^3.17.0",
"react-native-shared-element": "^0.8.4",
"react-native-shimmer-placeholder": "^2.0.9",
"react-native-simple-toast": "^1.1.4",
"react-native-status-bar-height": "^2.6.0",
"react-native-svg": "^13.2.0",
"react-native-swiper": "^1.6.0",
"react-native-vector-icons": "^9.2.0",
"react-native-video": "^5.2.1",
"react-native-video-player": "^0.14.0",
"react-native-webview": "^11.23.1",
"react-navigation-shared-element": "^3.1.3",
"react-redux": "^8.0.2",
"reactotron-react-native": "^5.0.2",
"redux": "^4.2.0",
"redux-persist": "^6.0.0",
"redux-saga": "^1.2.1",
"reduxsauce": "^1.2.1",
"rn-fetch-blob": "^0.12.0",
"seamless-immutable": "^7.1.4",
"url-parse": "^1.5.10",
"yarn": "^1.22.19",
"yarn-upgrade-all": "^0.7.1",
"yup": "^0.32.11"
},
"devDependencies": {
"@babel/core": "^7.19.1",
"@babel/runtime": "^7.19.0",
"@react-native-community/eslint-config": "^3.1.0",
"babel-jest": "^29.0.3",
"babel-plugin-ignite-ignore-reactotron": "^0.3.0",
"eslint": "^8.23.1",
"eslint-plugin-prettier": "^4.2.1",
"eslint-plugin-react": "^7.31.8",
"jest": "^29.0.3",
"metro-react-native-babel-preset": "^0.72.3",
"prettier": "^2.7.1",
"react-dom": "^18.2.0",
"react-native-svg-transformer": "^1.0.0",
"react-test-renderer": "^18.2.0",
"reactotron-redux": "^3.1.3",
"reactotron-redux-saga": "^4.2.3"
},
"jest": {
"preset": "react-native",
"testMatch": [
"<rootDir>/Tests/**/*.js",
"**/?(*.)(spec|test).js?(x)"
],
"testPathIgnorePatterns": [
"/node_modules/",
"<rootDir>/Tests/Setup.js"
],
"moduleNameMapper": {
"^.+\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$": "identity-obj-proxy"
},
"transform": {
"^.+\\.(js)$": "<rootDir>/node_modules/react-native/jest/preprocessor.js"
},
"setupFiles": [
"<rootDir>/Tests/Setup"
]
},
"config": {},
"standard": {
"parser": "babel-eslint",
"globals": [
"describe",
"test",
"jest",
"expect",
"fetch",
"navigator",
"__DEV__",
"XMLHttpRequest",
"FormData",
"React$Element"
]
}
}
I have the same issue
package.json deps
"dependencies": { "@react-native-async-storage/async-storage": "^1.17.10", "@react-native-community/blur": "^4.2.0", "@react-native-community/push-notification-ios": "^1.10.1", "@react-native-community/slider": "^3.0.3", "@react-native-firebase/analytics": "^15.6.0", "@react-native-firebase/app": "^15.6.0", "@react-native-firebase/crashlytics": "^15.6.0", "@react-native-firebase/messaging": "^15.6.0", "@react-native-firebase/remote-config": "^15.6.0", "@react-native-masked-view/masked-view": "^0.2.7", "@react-native-picker/picker": "^2.3.0", "@react-navigation/drawer": "^6.5.0", "@react-navigation/native": "^6.0.8", "@react-navigation/native-stack": "^6.9.0", "@react-navigation/stack": "^6.2.0", "axios": "^0.21.2", "crypto-js": "^3.3.0", "date-fns": "^2.29.2", "deprecated-react-native-prop-types": "^2.3.0", "lottie-react-native": "^5.0.1", "polished": "^4.1.1", "react": "18.1.0", "react-native": "0.70.1", "react-native-appsflyer": "^6.5.21", "react-native-background-fetch": "^4.0.5", "react-native-camera": "^3.40.0", "react-native-check-version": "^1.0.16", "react-native-code-push": "^7.0.5", "react-native-collapsible": "^1.6.0", "react-native-config": "^1.4.2", "react-native-currency-input": "^1.0.1", "react-native-date-picker": "^4.1.1", "react-native-device-info": "^10.0.2", "react-native-dialog": "^9.1.2", "react-native-document-picker": "^7.1.0", "react-native-fast-image": "^8.5.11", "react-native-flash-message": "^0.1.23", "react-native-format-currency": "^0.0.3", "react-native-fs": "^2.18.0", "react-native-gesture-handler": "^2.6.0", "react-native-google-mobile-ads": "^5.0.0", "react-native-image-picker": "^4.7.3", "react-native-in-app-review": "^3.2.2", "react-native-iphone-x-helper": "^1.3.1", "react-native-linear-gradient": "^2.6.2", "react-native-localization": "^2.1.7", "react-native-localize": "^2.1.1", "react-native-paper": "^4.9.2", "react-native-permissions": "^3.0.5", "react-native-phone-number-input": "^2.1.0", "react-native-picker-select": "^8.0.4", "react-native-purchases": "^5.0.2", "react-native-push-notification": "^8.1.0", "react-native-qrcode-scanner": "^1.5.1", "react-native-reanimated": "^2.10.0", "react-native-safe-area-context": "^4.3.1", "react-native-screens": "^3.14.1", "react-native-share": "^7.2.0", "react-native-splash-screen": "^3.2.0", "react-native-uuid-generator": "^6.1.1", "react-native-vector-icons": "^8.1.0", "react-native-zip-archive": "^6.0.3", "react-number-format": "^4.4.1", "realm": "^11.0.0-rc.2", "styled-components": "^5.3.1", "xlsx": "^0.17.0", "yup": "^0.32.9" }, "devDependencies": { "@babel/core": "^7.15.0", "@babel/preset-typescript": "^7.16.7", "@babel/runtime": "^7.15.3", "@react-native-community/eslint-config": "^3.0.0", "@rnx-kit/dep-check": "^1.13.0", "@types/crypto-js": "^3.1.47", "@types/jest": "^27.4.1", "@types/react-native": "^0.64.2", "@types/react-native-push-notification": "^5.0.5", "@types/react-native-share": "^3.3.0", "@types/react-native-uuid-generator": "^4.0.0", "@types/react-native-vector-icons": "^6.4.5", "@types/react-test-renderer": "^17.0.1", "@types/styled-components-react-native": "^5.1.1", "@typescript-eslint/eslint-plugin": "^3.9.1", "@typescript-eslint/parser": "^3.9.1", "babel-eslint": "^10.1.0", "babel-jest": "^26.6.3", "babel-plugin-module-resolver": "^4.1.0", "eslint": "^7.32.0", "eslint-config-airbnb": "^18.2.0", "eslint-config-prettier": "^6.11.0", "eslint-import-resolver-typescript": "^2.2.1", "eslint-plugin-import": "^2.20.1", "eslint-plugin-jsx-a11y": "^6.2.3", "eslint-plugin-prettier": "^3.1.4", "eslint-plugin-react": "^7.19.0", "eslint-plugin-react-hooks": "^2.5.0", "jest": "^26.6.3", "jetifier": "^1.6.6", "metro-react-native-babel-preset": "^0.72.1", "patch-package": "^6.2.2", "prettier": "^2.0.5", "react-native-typescript-transformer": "^1.2.13", "react-test-renderer": "18.1.0", "ts-jest": "^27.1.4", "typescript": "^4.4.3" },
my colleague @lirazhad was able to fix it by applying this patch package on react-native 0.70.0 itself! don't forget to add this dependency into your package.json. "deprecated-react-native-prop-types": "^2.3.0",
diff --git a/node_modules/react-native/index.js b/node_modules/react-native/index.js
index d59ba34..8023167 100644
--- a/node_modules/react-native/index.js
+++ b/node_modules/react-native/index.js
@@ -435,32 +435,16 @@ module.exports = {
},
// Deprecated Prop Types
get ColorPropType(): $FlowFixMe {
- invariant(
- false,
- 'ColorPropType has been removed from React Native. Migrate to ' +
- "ColorPropType exported from 'deprecated-react-native-prop-types'.",
- );
+ return require("deprecated-react-native-prop-types").ColorPropType
},
get EdgeInsetsPropType(): $FlowFixMe {
- invariant(
- false,
- 'EdgeInsetsPropType has been removed from React Native. Migrate to ' +
- "EdgeInsetsPropType exported from 'deprecated-react-native-prop-types'.",
- );
+ return require("deprecated-react-native-prop-types").EdgeInsetsPropType
},
get PointPropType(): $FlowFixMe {
- invariant(
- false,
- 'PointPropType has been removed from React Native. Migrate to ' +
- "PointPropType exported from 'deprecated-react-native-prop-types'.",
- );
+ return require("deprecated-react-native-prop-types").PointPropType
},
get ViewPropTypes(): $FlowFixMe {
- invariant(
- false,
- 'ViewPropTypes has been removed from React Native. Migrate to ' +
- "ViewPropTypes exported from 'deprecated-react-native-prop-types'.",
- );
+ return require("deprecated-react-native-prop-types").ViewPropTypes
},
};
source:
https://github.com/facebook/react-native/issues/33734#issuecomment-1206494929
any update? same issue
my colleague was able to fix it by applying this patch package on react-native 0.70.0 itself! don't forget to add this dependency into your package.json. "deprecated-react-native-prop-types": "^2.3.0",
diff --git a/node_modules/react-native/index.js b/node_modules/react-native/index.js index d59ba34..8023167 100644 --- a/node_modules/react-native/index.js +++ b/node_modules/react-native/index.js @@ -435,32 +435,16 @@ module.exports = { }, // Deprecated Prop Types get ColorPropType(): $FlowFixMe { - invariant( - false, - 'ColorPropType has been removed from React Native. Migrate to ' + - "ColorPropType exported from 'deprecated-react-native-prop-types'.", - ); + return require("deprecated-react-native-prop-types").ColorPropType }, get EdgeInsetsPropType(): $FlowFixMe { - invariant( - false, - 'EdgeInsetsPropType has been removed from React Native. Migrate to ' + - "EdgeInsetsPropType exported from 'deprecated-react-native-prop-types'.", - ); + return require("deprecated-react-native-prop-types").EdgeInsetsPropType }, get PointPropType(): $FlowFixMe { - invariant( - false, - 'PointPropType has been removed from React Native. Migrate to ' + - "PointPropType exported from 'deprecated-react-native-prop-types'.", - ); + return require("deprecated-react-native-prop-types").PointPropType }, get ViewPropTypes(): $FlowFixMe { - invariant( - false, - 'ViewPropTypes has been removed from React Native. Migrate to ' + - "ViewPropTypes exported from 'deprecated-react-native-prop-types'.", - ); + return require("deprecated-react-native-prop-types").ViewPropTypes }, }; source: https://github.com/facebook/react-native/issues/33734#issuecomment-1206494929
I tried. Same issue !
my colleague was able to fix it by applying this patch package on react-native 0.70.0 itself! don't forget to add this dependency into your package.json. "deprecated-react-native-prop-types": "^2.3.0",
diff --git a/node_modules/react-native/index.js b/node_modules/react-native/index.js index d59ba34..8023167 100644 --- a/node_modules/react-native/index.js +++ b/node_modules/react-native/index.js @@ -435,32 +435,16 @@ module.exports = { }, // Deprecated Prop Types get ColorPropType(): $FlowFixMe { - invariant( - false, - 'ColorPropType has been removed from React Native. Migrate to ' + - "ColorPropType exported from 'deprecated-react-native-prop-types'.", - ); + return require("deprecated-react-native-prop-types").ColorPropType }, get EdgeInsetsPropType(): $FlowFixMe { - invariant( - false, - 'EdgeInsetsPropType has been removed from React Native. Migrate to ' + - "EdgeInsetsPropType exported from 'deprecated-react-native-prop-types'.", - ); + return require("deprecated-react-native-prop-types").EdgeInsetsPropType }, get PointPropType(): $FlowFixMe { - invariant( - false, - 'PointPropType has been removed from React Native. Migrate to ' + - "PointPropType exported from 'deprecated-react-native-prop-types'.", - ); + return require("deprecated-react-native-prop-types").PointPropType }, get ViewPropTypes(): $FlowFixMe { - invariant( - false, - 'ViewPropTypes has been removed from React Native. Migrate to ' + - "ViewPropTypes exported from 'deprecated-react-native-prop-types'.", - ); + return require("deprecated-react-native-prop-types").ViewPropTypes }, }; source: https://github.com/facebook/react-native/issues/33734#issuecomment-1206494929I tried. Same issue !
jayscottthomas wow I don't know, anyway why i did is not viable, React strongly do not recommend a such patch-package.
It's also not recommend to use patch-package on the React Native file because this will only mask the issue. https://github.com/facebook/react-native/issues/33734#issuecomment-1242387033
What I smell is that there is no choice, each of use MUST identify which 3rd party uses the forbidden type, and try to update it, or to fix it by opening a PR in the 3rd repo itself. [the pb is that search in my node_modules, and no trace of a such deprecated type!] React are clear, they do not intend to fix this ! https://github.com/facebook/react-native/issues/33734#issuecomment-1242387033
- The approach of the react native team in releasing the new updates is wrong. Their duty is just to release a working react native package. The react native on its own without the thousands of other packages is useless.
- The real cause of errors also in the recent releases is not clear.
- By suggestion of someone after many hours of searching, I ran: npm start --reset-cache
- two packages (react-native-vector-icons AND react-native-navigations) are showing the error: invalid configuration: "dependency.assets" is not allowed,"dependency.hooks" is not allowed.
- At the moment, react-native-navigations is not supporting the New Architecture.
- These packages are very popular and the core of applications for so many developers. The react native team should be in contact with the maintainers of these packages or at least warn the developers before upgrading by a message like: By updating the React Native to x.x.x version, These packages are not supported.
Now after wasting so much time, I have to downgrade to 0.68
what version should i try ?? i tried everything same issue
what version should i try ?? i tried everything same issue
do not use/upgraded to latest version for the while. patching isn't good
thanks now it working after moving to react native 0.68 version
How can i downgrade the React Native version? I just tried changing the version in the package.json and then runnning 'npm install' and my whole project exploded. React Native CLI, doesn't seem to let you downgrade as well, only upgrade
npm install @.*** use this
On Thu, Sep 22, 2022, 6:49 PM marcodiloreto @.***> wrote:
How can i downgrade the React Native version? I just tried changing the version in the package.json and then runnning 'npm install' and my whole project exploded. React Native CLI, doesn't seem to let you downgrade as well, only upgrade
— Reply to this email directly, view it on GitHub https://github.com/facebook/react-native/issues/34688#issuecomment-1255014033, or unsubscribe https://github.com/notifications/unsubscribe-auth/APULPG4ITCIBB7WFZAHXRKTV7RMFTANCNFSM6AAAAAAQMLU6CI . You are receiving this because you commented.Message ID: @.***>
what do you mean @... [email protected]? It just explodes with every other dependency. I tried generating a bare new react-native in version 0.69.5 and it isnt working either.
do you usually just run npm install react-native@..** and it downgrades without dependency collision?
@marcodiloreto Unfortunately, you need to check and apply the changes manually after npm install [email protected]. use this tool: https://react-native-community.github.io/upgrade-helper/?from=0.68.0&to=0.70.1 (you delete the green lines of code from the right side and replace them with the red lines of code on the left side.)
Then: Delete Pods folder and Podfile.lock
cd ios
pod update && pod install
If you have a copy of the whole folder of your project(before the upgrade), you can simply replace it. but it seems you don't have any.
Good Luck
I succeed to avoid this error. In my case, it was due to the react-native-gesture-handler that changed. Previously we needed to import it at the top of the root file, now we must do that in App.js instead
import { GestureHandlerRootView } from 'react-native-gesture-handler'; /* ... */ // Wrap your app with the new GestureHandler <GestureHandlerRootView style={{ flex: 1 }}> /* your app */ </GestureHandlerRootView>Hope it will help
Not worked for me.
Yes, before not worked for me. but after again i removed below lines.
import { GestureHandlerRootView } from 'react-native-gesture-handler'; /* ... / // Wrap your app with the new GestureHandler <GestureHandlerRootView style={{ flex: 1 }}> / your app */ </GestureHandlerRootView>
I am facing same issue when I create release build, not on debug builds. Is it same for everyone?
Any one can solve this issue https://github.com/facebook/react-native/issues/34688#issue-1372899948
same issue, how to resolve?
