Exception in native call from JS: Unexpected token '<' - react-native

Question

Installing an existing React-native application is throwing error.
Logcat error:
E/unknown:ReactNative: Exception in native call from JS
com.facebook.react.devsupport.JSException: Unexpected token '<'
at com.facebook.react.bridge.queue.NativeRunnable.run(Native Method)
at android.os.Handler.handleCallback(Handler.java:938)
at android.os.Handler.dispatchMessage(Handler.java:99)
at com.facebook.react.bridge.queue.MessageQueueThreadHandler.dispatchMessage(Unknown Source:0)
at android.os.Looper.loopOnce(Looper.java:201)
at android.os.Looper.loop(Looper.java:288)
at com.facebook.react.bridge.queue.MessageQueueThreadImpl$4.run(Unknown Source:37)
at java.lang.Thread.run(Thread.java:920)
Caused by: com.facebook.jni.CppException: Unexpected token '<'`
no stack
... 8 more
D/SoLoader: Loaded: libyoga.so
E/ReactNativeJNI: Attempting to call JS function on a bad application bundle: HMRClient.setup()
E/unknown:ReactNative: Exception in native call
java.lang.RuntimeException: Attempting to call JS function on a bad application bundle: HMRClient.setup()
at com.facebook.react.bridge.queue.NativeRunnable.run(Native Method)
at android.os.Handler.handleCallback(Handler.java:938)
at android.os.Handler.dispatchMessage(Handler.java:99)
at com.facebook.react.bridge.queue.MessageQueueThreadHandler.dispatchMessage(Unknown Source:0)
at android.os.Looper.loopOnce(Looper.java:201)
at android.os.Looper.loop(Looper.java:288)
at com.facebook.react.bridge.queue.MessageQueueThreadImpl$4.run(Unknown Source:37)
at java.lang.Thread.run(Thread.java:920)
E/ReactNativeJNI: Attempting to call JS function on a bad application bundle: AppRegistry.runApplication()
E/unknown:ReactNative: Exception in native call
java.lang.RuntimeException: Attempting to call JS function on a bad application bundle: AppRegistry.runApplication()
at com.facebook.react.bridge.queue.NativeRunnable.run(Native Method)
at android.os.Handler.handleCallback(Handler.java:938)
at android.os.Handler.dispatchMessage(Handler.java:99)
at com.facebook.react.bridge.queue.MessageQueueThreadHandler.dispatchMessage(Unknown Source:0)
at android.os.Looper.loopOnce(Looper.java:201)
at android.os.Looper.loop(Looper.java:288)
at com.facebook.react.bridge.queue.MessageQueueThreadImpl$4.run(Unknown Source:37)
at java.lang.Thread.run(Thread.java:920)
D/SoLoader: init exiting
Output of npx react-native info
info Fetching system and libraries information...
System:
OS: macOS 12.4
CPU: (8) x64 Apple M1
Memory: 40.87 MB / 8.00 GB
Shell: 5.8.1 - /bin/zsh
Binaries:
Node: 14.19.0 - /usr/local/bin/node
npm: 6.14.16 - /usr/local/bin/npm
Watchman: 2022.06.13.00 - /opt/homebrew/bin/watchman
SDKs:
iOS SDK:
Platforms: iOS 15.0, DriverKit 20.4, macOS 11.3, tvOS 15.0, watchOS 8.0
Android SDK:
API Levels: 29, 30, 31, 32
Build Tools: 29.0.2, 30.0.2, 30.0.3, 32.0.0, 32.1.0
System Images: android-30 | Intel x86 Atom_64, android-32 | Google APIs ARM 64 v8a
IDEs:
Android Studio: 2021.1 AI-211.7628.21.2111.8193401
Xcode: 13.0/13A233 - /usr/bin/xcodebuild
npmPackages:
react: 16.9.0 => 16.9.0
react-native: 0.61.1 => 0.61.1
Steps to reproduce
Create a React native app with version 0.61.1,
Install npm dependencies: npm i (tried npm i --legacy-peer-deps)
Run metro server: npx react-native start --reset-cache
Run android build: npx react-native run-android (I am using Android studio to run the app)
I have already been through following issue resolutions but nothing worked for me:
https://github.com/facebook/react-native/issues/21074
https://github.com/facebook/react-native/issues/32875
https://github.com/babel/babel/issues/14139

Answer 1

First clear your cache and node_module using the below command
cd android && ./gradlew cleanBuildCache && cd .. &&
watchman watch-del-all && rm -rf node_modules/ &&
rm -rf $TMPDIR/react-native-packager-cache-* && rm -rf
$TMPDIR/metro-bundler-cache-* &&
yarn cache clean && yarn install &&
yarn start --reset-cache
After done this change you babel.config.js
module.exports = {
presets: [['module:metro-react-native-babel-preset', {
unstable_disableES6Transforms: true
}]],
};