I have a react native app that it worked well until upgrade packages Actually after upgrade packages this permision added (android.permission.QUERY_ALL_PACKAGES) to manifest.please help me
this is first package.json
{
"name": "mazeapp",
"version": "2.0.0",
"private": true,
"scripts": {
"android": "react-native run-android",
"ios": "react-native run-ios",
"start": "react-native start",
"test": "jest",
"lint": "eslint ."
},
"dependencies": {
"#gregfrench/react-native-wheel-picker": "^1.2.15",
"#miblanchard/react-native-slider": "^2.0.1",
"#react-native-community/async-storage": "1.12.1",
"#react-native-community/checkbox": "0.3.0",
"#react-native-community/netinfo": "4.6.0",
"#react-native-community/toolbar-android": "0.1.0-rc.2",
"#react-native-firebase/app": "6.7.1",
"#react-native-firebase/messaging": "6.7.1",
"#react-native-picker/picker": "^1.9.10",
"axios": "^0.19.0",
"lottie-react-native": "3.5.0",
"moment-jalaali": "^0.9.2",
"react": "16.9.0",
"react-dom": "16.9.0",
"react-native": "0.61.5",
"react-native-app-intro-slider": "4.0.4",
"react-native-awesome-alerts": "1.4.2",
"react-native-background-actions": "^2.6.4",
"react-native-background-timer": "2.4.1",
"react-native-check-box": "^2.1.7",
"react-native-confirmation-code-field": "^4.1.0",
"react-native-date-picker": "3.2.5",
"react-native-device-info": "5.6.5",
"react-native-easy-toast": "^1.2.0",
"react-native-emoji": "1.8.0",
"react-native-exit-app": "^1.1.0",
"react-native-file-picker": "0.0.19",
"react-native-fs": "^2.16.6",
"react-native-gesture-handler": "1.5.6",
"react-native-i18n": "^2.0.15",
"react-native-image-crop-picker": "^0.28.0",
"react-native-image-picker": "2.3.4",
"react-native-inappbrowser-reborn": "^3.5.1",
"react-native-item-select": "0.3.0",
"react-native-modal": "11.5.6",
"react-native-modalbox": "2.0.2",
"react-native-motion": "1.0.5",
"react-native-otp-verify": "^1.0.3",
"react-native-persian-calendar-picker": "^3.1.1",
"react-native-popup-dialog": "0.18.3",
"react-native-progress": "4.1.2",
"react-native-push-notification": "^7.3.1",
"react-native-rate": "^1.2.4",
"react-native-ratings": "^7.4.0",
"react-native-reanimated": "~1.4.0",
"react-native-root-toast": "3.2.1",
"react-native-safe-area-context": "0.6.0",
"react-native-screens": "2.0.0-alpha.12",
"react-native-sectioned-multi-select": "0.8.1",
"react-native-select-contact": "^1.5.0",
"react-native-simple-modal": "^9.0.1",
"react-native-simple-radio-button": "^2.7.4",
"react-native-snap-carousel": "^3.9.1",
"react-native-sound": "0.11.0",
"react-native-sqlite-storage": "^5.0.0",
"react-native-stars": "^1.2.2",
"react-native-step-indicator": "^1.0.3",
"react-native-svg": "9.13.3",
"react-native-svg-charts": "5.4.0",
"react-native-swiper": "^1.6.0",
"react-native-table-component": "^1.2.1",
"react-native-textinput-effects": "^0.5.1",
"react-native-typing-animation": "^0.1.7",
"react-native-uuid-generator": "^6.1.1",
"react-native-vector-icons": "6.7.0",
"react-native-view-more-text": "^2.1.0",
"react-native-web": "^0.11.7",
"react-native-webview": "^11.4.1",
"react-navigation": "4.4.3",
"react-navigation-stack": "^1.10.3",
"react-navigation-tabs": "2.10.1",
"react-number-format": "4.4.1",
"react-redux": "7.2.2",
"redux": "^4.0.4",
"redux-thunk": "^2.3.0",
"rn-fetch-blob": "^0.12.0",
"socket.io-client": "^2.4.0",
"styled-components": "5.2.1",
"victory-native": "^33.0.1"
},
"devDependencies": {
"#babel/core": "7.12.3",
"#babel/runtime": "7.12.1",
"#react-native-community/eslint-config": "^0.0.7",
"babel-jest": "25.5.1",
"eslint": "^6.8.0",
"jest": "25.5.4",
"jetifier": "1.6.6",
"metro-react-native-babel-preset": "^0.58.0",
"react-native-bundle-visualizer": "2.2.1",
"react-test-renderer": "16.9.0"
},
"jest": {
"preset": "react-native"
}
}
this is secound file package.json
{
"name": "mazeapp",
"version": "2.1.1",
"private": true,
"scripts": {
"android": "react-native run-android",
"ios": "react-native run-ios",
"start": "react-native start",
"test": "jest",
"lint": "eslint ."
},
"dependencies": {
"#miblanchard/react-native-slider": "^2.0.1",
"#react-native-community/async-storage": "1.12.1",
"#react-native-community/checkbox": "0.3.0",
"#react-native-community/netinfo": "4.6.0",
"#react-native-community/toolbar-android": "^0.2.1",
"#react-native-firebase/analytics": "^14.0.0",
"#react-native-firebase/app": "^14.0.0",
"#react-native-firebase/messaging": "^14.0.0",
"axios": "^0.19.0",
"lottie-react-native": "3.5.0",
"moment-jalaali": "^0.9.2",
"react": "^17.0.2",
"react-dom": "^17.0.2",
"react-native": "^0.66.4",
"react-native-app-intro-slider": "4.0.4",
"react-native-awesome-alerts": "1.4.2",
"react-native-background-actions": "^2.6.4",
"react-native-background-timer": "2.4.1",
"react-native-check-box": "^2.1.7",
"react-native-confirmation-code-field": "^7.2.0",
"react-native-device-info": "5.6.5",
"react-native-emoji": "1.8.0",
"react-native-exit-app": "^1.1.0",
"react-native-file-picker": "0.0.19",
"react-native-fs": "^2.16.6",
"react-native-gesture-handler": "1.5.6",
"react-native-image-crop-picker": "^0.28.0",
"react-native-image-picker": "2.3.4",
"react-native-inappbrowser-reborn": "^3.5.1",
"react-native-item-select": "0.3.0",
"react-native-modal": "11.5.6",
"react-native-modalbox": "2.0.2",
"react-native-motion": "1.0.5",
"react-native-otp-verify": "^1.0.3",
"react-native-persian-calendar-picker": "^3.1.1",
"react-native-progress": "4.1.2",
"react-native-push-notification": "^7.3.1",
"react-native-rate": "^1.2.4",
"react-native-ratings": "^7.4.0",
"react-native-reanimated": "~1.4.0",
"react-native-root-toast": "^3.3.0",
"react-native-safe-area-context": "^3.3.2",
"react-native-screens": "2.0.0-alpha.12",
"react-native-select-contact": "^1.5.0",
"react-native-simple-modal": "^9.0.1",
"react-native-simple-radio-button": "^2.7.4",
"react-native-snap-carousel": "^3.9.1",
"react-native-sound": "0.11.0",
"react-native-sqlite-storage": "^5.0.0",
"react-native-stars": "^1.2.2",
"react-native-step-indicator": "^1.0.3",
"react-native-svg": "^9.13.3",
"react-native-svg-charts": "5.4.0",
"react-native-swiper": "^1.6.0",
"react-native-textinput-effects": "^0.5.1",
"react-native-typing-animation": "^0.1.7",
"react-native-uuid-generator": "^6.1.1",
"react-native-vector-icons": "^9.0.0",
"react-native-view-more-text": "^2.1.0",
"react-native-web": "^0.11.7",
"react-native-webview": "^11.4.1",
"react-navigation": "4.4.3",
"react-navigation-stack": "^1.10.3",
"react-navigation-tabs": "^2.10.1",
"react-number-format": "4.4.1",
"react-redux": "7.2.2",
"redux": "^4.0.4",
"redux-thunk": "^2.3.0",
"rn-fetch-blob": "^0.12.0",
"socket.io-client": "^2.4.0",
"victory-native": "^33.0.1"
},
"devDependencies": {
"#babel/core": "7.16.5",
"#babel/runtime": "7.16.5",
"#react-native-community/eslint-config": "2.0.0",
"babel-jest": "26.6.3",
"eslint": "7.14.0",
"jest": "26.6.3",
"jetifier": "1.6.6",
"metro-react-native-babel-preset": "0.66.2",
"react-native-bundle-visualizer": "2.2.1",
"react-test-renderer": "17.0.2"
},
"jest": {
"preset": "react-native"
}
}
build.gradle
// Top-level build file where you can add configuration options common to all sub-projects/modules.
buildscript {
ext {
// googlePlayServicesVersion = "4.3.3" // default: "+"
// firebaseMessagingVersion = "+" // default: "+"
buildToolsVersion = "30.0.2"
minSdkVersion = 21
compileSdkVersion = 30
targetSdkVersion = 30
supportLibVersion = "28.0.0"
}
repositories {
google()
jcenter()
}
dependencies {
classpath("com.android.tools.build:gradle:4.2.2")
// NOTE: Do not place your application dependencies here; they belong
// in the individual module build.gradle files
classpath 'com.google.gms:google-services:4.3.3'
classpath 'com.google.firebase:firebase-crashlytics-gradle:2.8.1'
}
}
allprojects {
repositories {
mavenCentral()
mavenLocal()
maven {
// All of React Native (JS, Obj-C sources, Android binaries) is installed from npm
url("$rootDir/../node_modules/react-native/android")
}
maven {
// Android JSC is installed from npm
url("$rootDir/../node_modules/jsc-android/dist")
}
google()
maven { url 'https://jitpack.io' }
}
}
For those having a similar issue or that have to explain to the Play Store why this permission is in place, this is added by react-native-inappbrowser-reborn package, there is a PR to fix that here:
https://github.com/proyecto26/react-native-inappbrowser/pull/335
It seems that at the time writing this post, it's not live in the NPM directory. But you should try to update the package and see if its gone.
One way to figure out which dependency injects permissions is by running this command at the root of your project (on unix based OS):
grep -r QUERY_ALL_PACKAGES *
This will tell you the file that has that text and this will point you on the right direction.
It is because of target SDK updated to 30, some features (eg: Speech recognition,TTS) works in from android 11 device only after adding following code in our AndroidManifest.xml
<uses-permission android:name="android.permission.QUERY_ALL_PACKAGES"
tools:node="remove" tools:ignore="QueryAllPackagesPermission" />
also android:exported="true" inside <activity>
It is mentioned in here Behavior changes: Apps targeting Android 11
You might have to exclusively declare the tools namespace in the manifest header tag for this to work. xmlns:tools="http://schemas.android.com/tools" so that the header will look like this
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
package="com.example.app">
You can confirm that the package is included in your apk using.
apkTook
install using instructions on website
build your apk
run apktool decode /path/to/your/app-release.apk
There should now be a giant merged manifest file containing all permissions for your apk.
Once you have confirmed that the permission is included in your apk.
You can then use #imekinox 's answer to detect which dependency is including the permission.
You can then chose to disable the permission from appearing in your final APk file
by including the following change in your manifest.
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
package="com.cortexmonitoring">
<uses-permission android:name="android.permission.QUERY_ALL_PACKAGES" tools:node="remove" tools:ignore="QueryAllPackagesPermission" />
Notice that xmlns:tools="http://schemas.android.com/tools" is required at the top of the manifest file.
More than likely the issue is https://github.com/proyecto26/react-native-inappbrowser/pull/335 and disabling the permission in this way may break this or other packages.
The real fix would be removing or updating any dependencies that include this permission.
for the ones who follow #Thanhal's answer:
check your AndroidManifest.xml file and add
xmlns:tools="http://schemas.android.com/tools"
to the manifest markup if it's not there.
example:
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
package="your-app-package">
#imekinox has the correct solution, however, after I went to the Github page he linked, the fix for react-native-inappbrowser is merged but no new release with it has been published yet.
I found another NPM release that has it included:
https://www.npmjs.com/package/#jinshin1013/react-native-inappbrowser-reborn
Uninstall the old version and install this version and that should fix it.
There is great probability that your app will get rejected by Play store if you use QUERY_ALL_PACKAGES permission.
As mentioned in below link "In the rare cases where the element doesn't provide adequate package visibility, you can use the QUERY_ALL_PACKAGES permission. If you publish your app on Google Play, your app's use of this permission is subject to approval."
https://developer.android.com/training/package-visibility
Add queries to AndroidManifest.xml file as mentioned below.
<queries>
<intent>
<action android:name="android.support.customtabs.action.CustomTabsService" />
</intent>
<intent>
<action android:name="android.intent.action.VIEW" />
<category android:name="android.intent.category.BROWSABLE" />
<data android:scheme="http" />
</intent>
<intent>
<action android:name="android.intent.action.VIEW" />
<category android:name="android.intent.category.BROWSABLE" />
<data android:scheme="https" />
</intent>
<intent>
<action android:name="android.media.action.IMAGE_CAPTURE" />
</intent>
<intent>
<action android:name="android.intent.action.GET_CONTENT" />
</intent>
</queries>
Related
I'm using
aws-amplify: 4.3.11,
aws-amplify-react-native: 6.0.4.
When I try to sign in and enter username and password, it first freezes the screen and hangs the sign-in button, then works and throws an exception
"Incorrect username or password". Error NotAuthorizedException.
It was operating OK for me until it began to cause problems, such as logging in the user sometimes and not logging in the user at other times, and eventually, it stopped working entirely.
Furthermore, it is fully functional on iOS. Also, when I open the settings or debug the application from the developer menu, the application crashed.
However, It starts working when I uninstall react-native-reanimated and react-navigation/drawer and clean the project. However, anytime I reinstall them and my default screen is the drawer, it causes the app to crash just by accessing it.
However, if I make the signUp screen the initial route, the application runs but in Auth.SignIn I'm still getting the NotAuthorizedException issue when I try to sign in.
Here is my code of sign In
let responseSignIn = await Auth.signIn({
username: email.toLowerCase(),
password,
});
if (responseSignIn) {
let session = await Auth.currentSession();
let token = session.getIdToken().getJwtToken();
saveToken(token);
setLoading(false);
dispatch(LoginWithEmailSuccess({token}));
console.log(token);
}
} catch (e) {
console.log(`Error ${e}`);
setpasswordError(e.message);
setLoading(false);
}```
Here is my package.json file
```{
"name": "SkillGigs",
"version": "0.0.1",
"private": true,
"scripts": {
"android": "react-native run-android",
"ios": "react-native run-ios",
"start": "react-native start",
"test": "jest",
"lint": "eslint ."
},
"dependencies": {
"#apollo/client": "^3.5.7",
"#brlja/react-native-slider": "^0.12.1",
"#react-native-async-storage/async-storage": "^1.15.14",
"#react-native-community/checkbox": "^0.5.9",
"#react-native-community/clipboard": "^1.5.1",
"#react-native-community/netinfo": "^7.1.7",
"#react-native-google-signin/google-signin": "^7.0.4",
"#react-native-picker/picker": "^2.2.1",
"#react-navigation/material-top-tabs": "^6.1.1",
"#react-navigation/native": "^6.0.6",
"#react-navigation/stack": "^6.0.11",
"amazon-cognito-identity-js": "^5.2.3",
"aws-amplify": "^4.3.11",
"aws-amplify-react-native": "^6.0.4",
"axios": "^0.21.1",
"date-fns": "^2.28.0",
"graphql": "^14.0.0",
"moment": "^2.29.1",
"react": "17.0.2",
"react-native": "^0.66.4",
"react-native-autocomplete-input": "^5.0.2",
"react-native-calendar-picker": "^7.1.2",
"react-native-calendars": "^1.1277.0",
"react-native-chart-kit": "^6.12.0",
"react-native-cn-quill": "^0.7.15",
"react-native-color-matrix-image-filters": "^5.2.10",
"react-native-dimension": "^1.0.6",
"react-native-document-picker": "^7.1.3",
"react-native-draggable-flatlist": "^3.0.6",
"react-native-dropdown-picker": "^5.2.3",
"#react-navigation/drawer": "^6.1.4",
"react-native-fbsdk": "^3.0.0",
"react-native-geolocation-service": "^5.3.0-beta.4",
"react-native-gesture-handler": "^2.1.1",
"react-native-get-random-values": "^1.7.2",
"react-native-image-crop-tools": "^1.5.0",
"react-native-image-picker": "^4.7.0",
"react-native-image-resizer": "^1.4.5",
"react-native-image-rotate": "^2.1.0",
"react-native-image-to-pdf": "^1.2.0",
"react-native-modal-dropdown": "^1.0.2",
"react-native-pager-view": "^5.4.11",
"react-native-ratings": "^8.1.0",
"react-native-reanimated": "^2.4.1",
"react-native-render-html": "^6.3.4",
"react-native-responsive-screen": "^1.4.2",
"react-native-safe-area-context": "^3.3.2",
"react-native-screens": "^3.10.1",
"react-native-share": "^7.3.7",
"react-native-simple-image-cropper": "^3.2.1",
"react-native-simple-radio-button": "^2.7.4",
"react-native-svg": "^12.1.1",
"react-native-swiper": "^1.6.0",
"react-native-switch-toggle": "^2.2.1",
"react-native-tab-view": "^3.1.1",
"react-native-vector-icons": "^9.0.0",
"react-native-video": "^5.1.1",
"react-native-virtualized-view": "^0.1.5",
"react-native-webview": "^11.16.0",
"react-redux": "^7.2.6",
"redux": "^4.1.2",
"redux-saga": "^1.1.3",
"rn-fetch-blob": "^0.12.0",
"victory-native": "^36.3.1"
},
"devDependencies": {
"#babel/core": "^7.16.5",
"#babel/runtime": "^7.16.5",
"#react-native-community/eslint-config": "^3.0.1",
"babel-jest": "^27.4.5",
"eslint": "^8.5.0",
"jest": "^27.4.5",
"metro-react-native-babel-preset": "^0.66.2",
"react-test-renderer": "17.0.2"
},
"jest": {
"preset": "react-native"
}
}```
I am running a react-native app which has been working until we updated some of the pods to install a new library. The error is below when running the app:
ERROR TypeError: Cannot read property 'ExpoUpdates' of undefined, js engine: hermes
ERROR Invariant Violation: Module AppRegistry is not a registered callable module (calling runApplication). 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
ERROR Invariant Violation: Module AppRegistry is not a registered callable module (calling runApplication). 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
I am now experiencing this error - note we have ejected the app from expo so it is a react-native app. However, with some modules still being used from expo and some supporting unimodules this error is being thrown everytime we compile on iOS.
I have tried the following:
Reinstalling node modules
Reinstalling pods
Deleting lockfiles and re-installing
Changing xcode version from 12.4, 12.5 and 13
Is there some other issue that I am missing? Note: There have actually not been any changes to the app config.
Here is the package.json:
{
"name": "ProjectX",
"version": "0.0.1",
"private": true,
"scripts": {
"android": "react-native run-android",
"ios": "react-native run-ios",
"start": "react-native start",
"test": "jest",
"lint": "eslint .",
"update:pods": "cd ios && pod install --repo-update && cd ..",
"postinstall": "yarn run update:pods"
},
"dependencies": {
"#expo/react-native-action-sheet": "^3.8.0",
"#notifee/react-native": "^1.1.1",
"#ptomasroos/react-native-multi-slider": "^2.2.2",
"#react-native-async-storage/async-storage": "^1.15.4",
"#react-native-community/art": "^1.2.0",
"#react-native-community/checkbox": "^0.5.7",
"#react-native-community/clipboard": "^1.5.1",
"#react-native-community/datetimepicker": "^3.4.3",
"#react-native-community/image-editor": "^2.3.0",
"#react-native-community/masked-view": "^0.1.10",
"#react-native-community/netinfo": "^6.0.0",
"#react-native-community/slider": "^3.0.3",
"#react-native-community/toolbar-android": "0.1.0-rc.2",
"#react-native-community/viewpager": "5.4.4",
"#react-native-firebase/app": "^10.8.1",
"#react-native-firebase/auth": "^11.2.0",
"#react-native-firebase/firestore": "^10.8.1",
"#react-native-firebase/functions": "^11.3.0",
"#react-native-firebase/messaging": "^10.8.1",
"#react-native-firebase/remote-config": "^10.8.1",
"#react-native-firebase/storage": "^10.8.1",
"#react-native-picker/picker": "^2.2.1",
"#react-navigation/bottom-tabs": "^5.11.8",
"#react-navigation/native": "^5.9.3",
"#react-navigation/stack": "^5.14.3",
"#storybook/react-native": "^5.3.25",
"add": "^2.0.6",
"apisauce": "^1.1.1",
"aws-amplify": "^3.3.24",
"base-64": "^0.1.0",
"buffer": "^6.0.3",
"compare-versions": "^3.6.0",
"expo-asset": "^8.1.7",
"expo-av": "^9.0.0",
"expo-constants": "^9.1.1",
"expo-file-system": "^9.0.1",
"expo-font": "^8.2.1",
"expo-image-manipulator": "^8.2.1",
"expo-image-picker": "^8.3.0",
"expo-location": "^8.2.1",
"expo-media-library": "^11.0.0",
"expo-permissions": "^11.0.0",
"expo-video-thumbnails": "^5.1.0",
"formik": "^2.1.4",
"i": "^0.3.6",
"lodash": "^4.17.21",
"moment": "^2.27.0",
"native-base": "^2.13.12",
"ngeohash": "^0.6.3",
"npm": "^6.14.5",
"prop-types": "^15.7.2",
"react": "17.0.2",
"react-native": "0.64.2",
"react-native-animatable": "^1.3.3",
"react-native-calendars": "^1.300.0",
"react-native-confetti-cannon": "^1.5.2",
"react-native-device-info": "^6.0.0",
"react-native-dotenv": "^0.2.0",
"react-native-easy-grid": "^0.2.2",
"react-native-emoticons": "^1.0.13",
"react-native-fbsdk": "^3.0.0",
"react-native-geocoding": "^0.4.0",
"react-native-gesture-handler": "^1.6.1",
"react-native-gifted-chat": "^0.16.3",
"react-native-keyboard-aware-scroll-view": "^0.9.3",
"react-native-linear-gradient": "^2.5.6",
"react-native-maps": "^0.27.1",
"react-native-mixpanel": "^1.2.0",
"react-native-modal": "^11.5.6",
"react-native-performance-monitor": "^1.2.1",
"react-native-permissions": "^3.0.1",
"react-native-progress": "^4.1.2",
"react-native-reanimated": "^1.9.0",
"react-native-safe-area-context": "^0.7.3",
"react-native-screens": "^2.9.0",
"react-native-snap-carousel": "^3.9.1",
"react-native-splash-screen": "^3.2.0",
"react-native-svg": "^12.1.0",
"react-native-swiper": "^1.6.0",
"react-native-unimodules": "^0.12.0",
"react-native-vector-icons": "^6.6.0",
"react-native-video": "^5.1.1",
"react-native-view-overflow": "^0.0.5",
"yup": "^0.29.1"
},
"devDependencies": {
"#babel/core": "^7.13.1",
"#babel/runtime": "^7.13.7",
"#react-native-community/eslint-config": "^2.0.0",
"babel-jest": "^26.6.3",
"eslint": "^7.20.0",
"jest": "^26.6.3",
"metro-react-native-babel-preset": "^0.66.0",
"react-native-codegen": "^0.0.7",
"react-test-renderer": "17.0.2"
},
"jest": {
"preset": "react-native"
}
}
I have some issues with my react native VR/AR.
I used the react-viro module.
Here are my code and error.
import {
ViroScene,
ViroImage,
Viro360Image
} from 'react-viro';
<ViroScene style={[S.container]}>
<Viro360Image source={require("../../assets/ar/res/guadalupe_360.jpg")} onLoadEnd={console.log('image is loaded successfully.')}/>
<ViroImage
position={[0, 0, -5]} source={require("../../assets/ar/res/grid_bg.jpg")} scale={[.1, .1, .1]}
opacity={0.0} onClick={this._onTitleClicked}
animation={{
name : "showTitleAnimation",
run : this.state.runShowTitleAnimation,
loop : false,
}} />
</ViroScene>
and here is my package.json
{
"scripts": {
"start": "expo start",
"web": "expo start --web",
"build": "expo build:android",
"build:ios": "expo build:ios",
"fingerprint": "expo fetch:android:hashes"
},
"dependencies": {
"#chartiful/react-native-chart-builder": "^0.1.8",
"#chartiful/react-native-vertical-bar-graph": "^0.1.2",
"#miblanchard/react-native-slider": "^1.5.0",
"#react-native-community/masked-view": "^0.1.10",
"axios": "^0.21.1",
"expo": "^40.0.0",
"expo-font": "~8.4.0",
"expo-image-picker": "~9.2.1",
"expo-linear-gradient": "~8.4.0",
"expo-splash-screen": "~0.8.1",
"firebase": "7.9.0",
"lodash": "^4.17.20",
"moment": "^2.29.1",
"native-base": "^2.15.2",
"prop-types": "^15.7.2",
"react": "17.0.1",
"react-dom": "17.0.1",
"react-native": "https://github.com/expo/react-native/archive/sdk-40.0.1.tar.gz",
"react-native-chart-kit": "^6.11.0",
"react-native-country-picker-modal": "^2.0.0",
"react-native-display-keyboard": "^0.2.0",
"react-native-easy-grid": "^0.2.2",
"react-native-geocoding": "^0.5.0",
"react-native-gesture-handler": "~1.8.0",
"react-native-google-places-autocomplete": "^2.1.3",
"react-native-maps": "0.27.1",
"react-native-maps-directions": "^1.8.0",
"react-native-modal": "^11.6.1",
"react-native-normalize": "^1.0.1",
"react-native-phone-input": "^0.2.4",
"react-native-progress-circle": "^2.1.0",
"react-native-screens": "^2.15.2",
"react-native-slider": "^0.11.0",
"react-native-snap-carousel": "^3.9.1",
"react-native-steps": "^1.3.0",
"react-native-svg": "^12.1.0",
"react-native-swiper": "^1.6.0",
"react-native-timeago": "^0.5.0",
"react-navigation": "^4.4.3",
"react-navigation-stack": "^2.10.2",
"react-redux": "^7.2.2",
"react-viro": "^2.17.0",
"redux": "^4.0.5",
"redux-thunk": "^2.3.0",
"rn-range-slider": "^2.0.4"
},
"devDependencies": {
"#babel/core": "~7.12.10",
"babel-jest": "~26.6.3",
"babel-preset-expo": "8.3.0",
"jest": "~26.6.3",
"react-test-renderer": "~17.0.1"
},
"private": true,
"name": "guix",
"version": "1.0.0"
}
I tried other modules and it returns the same error.
I tried the "react-native-360" and "react-native-vr"
Also, now this is expo but I tried this on react-native-cli also. but same was true. What is the VRTImage?
Why I get this error and what is the solution?
Here is my error
I am not sure i am completely Correct or not, But i face same situation recently and when i go through react-viro docs.
i get to know few things.
react-viro basically build on react-native version .59
gradle build and sdk version is about 28.0.3
android manifest file should be updated using setup-ide.sh android command file is available in nodemodules/react-viro/bin/js or you can manually update too! you can get docs from react-viro docs
https://docs.viromedia.com/docs/installing-viro-android
So the issue begins here new SDK Version is not supporting dependencies of react-viro and we may not be able to found effective solution or even solution(on basis of my current Research).
And Apart of that expo have not added react-viro ! So either way using expo it is impossible for now.
This is What i learned from R and D and changing gradle Version and Package version accordingly and it is became very difficult to build with downgrading react-native and sdk and gradle version and ofcource dependency of all packages that we are going to use.
I am new to react-native and creating apk using command sudo react-native run-android --variant=release app is working fine on usb debbuging, but when i am creating apk and run it on mobile device it gives error alert box
{"line":132,"column":7285,"sourceURL":"index.android.bundle"}
I am sharing package.json and babel.config.json
{
"name": "ReactNativeApp",
"version": "0.0.1",
"private": true,
"scripts": {
"android": "react-native run-android",
"ios": "react-native run-ios",
"start": "react-native start",
"test": "jest",
"lint": "eslint ."
},
"dependencies": {
"#bam.tech/react-native-snap-carousel": "^3.2.3",
"#react-native-community/datetimepicker": "^2.2.2",
"#react-native-community/masked-view": "^0.1.6",
"#react-navigation/drawer": "^5.1.0",
"#react-navigation/native": "^5.0.2",
"#react-navigation/stack": "^5.0.2",
"#twotalltotems/react-native-otp-input": "^1.2.0",
"core-js": "^3.6.4",
"react": "16.9.0",
"react-native": "0.61.5",
"react-native-app-intro-slider": "^3.0.0",
"react-native-bootsplash": "^0.1.0",
"react-native-countdown-component": "^2.6.0",
"react-native-datepicker": "^1.7.2",
"react-native-device-info": "^5.5.3",
"react-native-drawer": "^2.5.1",
"react-native-gesture-handler": "^1.6.0",
"react-native-image-picker": "^2.3.1",
"react-native-interactive-image-gallery": "^0.1.2",
"react-native-masonry-list": "^2.16.1",
"react-native-material-dialog": "^0.7.7",
"react-native-material-dropdown": "^0.11.1",
"react-native-modal": "^11.5.4",
"react-native-modal-datetime-picker": "^8.5.1",
"react-native-modal-dropdown": "^0.7.0",
"react-native-modals": "^0.19.9",
"react-native-photo-upload": "^1.3.0",
"react-native-reanimated": "^1.7.0",
"react-native-safe-area-context": "^0.7.2",
"react-native-screens": "^2.0.0-beta.2",
"react-native-snap-carousel": "^3.8.4",
"react-native-sqlite-storage": "^4.1.0",
"react-native-tab-view": "^2.13.0",
"react-native-textarea": "^1.0.3",
"react-native-vector-icons": "^6.6.0",
"react-navigation": "^4.1.1",
"react-navigation-drawer": "^2.3.4"
},
"devDependencies": {
"#babel/core": "^7.8.4",
"#babel/runtime": "^7.8.4",
"#react-native-community/eslint-config": "^0.0.7",
"babel-jest": "^25.1.0",
"eslint": "^6.8.0",
"jest": "^25.1.0",
"metro-react-native-babel-preset": "^0.58.0",
"react-test-renderer": "16.9.0"
},
"jest": {
"preset": "react-native"
}
}
and babel.config.json
module.exports = {
presets: ['module:metro-react-native-babel-preset'],
};
If you are using APIs call in the android and uses HTTP calls which is not secure then this problem will occur in Android API >= 28.
This problem comes in API < 28 but android handles it but now after API 28 they are not handling it rather want developers to use HTTPS api calls for added security. As android versions are coming they are more towards security.
But if you still want to use HTTP API calls in your android app, be it in react native or any other you have to add this in androidmanifest.xml file
<application
android:usesCleartextTraffic="true"
.......>
</application>
The value of usesCleartextTraffic is by default set to false in API > 28.So we have to manually set it to true to make it working.
When I run ./gradlew assembleRelease I get back this error:
Task :app:bundleReleaseJsAndAssets
warning: the transform cache was reset.
Loading dependency graph, done.
index.js: The 'decorators' plugin requires a 'decoratorsBeforeExport' option, whose value must be a boolean. If you are migrating from Babylon/Babel 6 or want to use the old decorators proposal, you should use the 'decorators-legacy' plugin instead of 'decorators'.
Error: The 'decorators' plugin requires a 'decoratorsBeforeExport' option, whose value must be a boolean. If you are migrating from Babylon/Babel 6 or want to use the old decorators proposal, you should use the 'decorators-legacy' plugin instead of 'decorators'.
I'm not using #Babel, but babel in my package.json file:
{
"name": "my-app",
"version": "0.0.1",
"private": true,
"scripts": {
"start": "node node_modules/react-native/local-cli/cli.js start",
"test": "jest"
},
"dependencies": {
"#ptomasroos/react-native-multi-slider": "0.0.12",
"firebase": "^5.1.0",
"javascript-time-ago": "^1.0.30",
"mobx": "^4.1.1",
"mobx-react": "^5.0.0",
"native-base": "^2.8.1",
"prop-types": "^15.6.2",
"protobufjs": "^6.8.8",
"react": "16.2.0",
"react-native": "^0.57.7",
"react-native-actionsheet": "^2.3.0",
"react-native-aws3": "0.0.8",
"react-native-axios": "^0.17.1",
"react-native-billing": "^2.9.1",
"react-native-card-stack-swiper": "^1.0.5",
"react-native-collapsible": "^0.10.0",
"react-native-cookies": "^3.2.0",
"react-native-datepicker": "^1.6.0",
"react-native-dropdownalert": "^3.5.0",
"react-native-elements": "^0.19.0",
"react-native-event-listeners": "^1.0.3",
"react-native-expandable-section-flatlist": "^1.0.3",
"react-native-fbsdk": "^0.8.0",
"react-native-fcm": "^16.0.0",
"react-native-floating-action": "^1.10.1",
"react-native-geocoding": "^0.3.0",
"react-native-gifted-chat": "^0.4.3",
"react-native-google-places-autocomplete": "^1.3.6",
"react-native-hide-show-password-input": "^1.0.7",
"react-native-image-crop-picker": "^0.19.3",
"react-native-image-picker": "^0.26.10",
"react-native-image-placeholder": "^1.0.14",
"react-native-instagram-login": "^1.0.7",
"react-native-keyboard-aware-scroll-view": "^0.4.4",
"react-native-keyboard-aware-scrollview": "^2.0.0",
"react-native-keyboard-spacer": "^0.4.1",
"react-native-linear-gradient": "^2.4.0",
"react-native-linkedin": "^1.3.1",
"react-native-localization": "^2.0.0",
"react-native-material-bottom-navigation": "^0.9.0",
"react-native-modal-datetime-picker": "^6.0.0",
"react-native-open-settings": "^1.0.1",
"react-native-pages": "^0.7.0",
"react-native-permissions": "^1.1.1",
"react-native-picker-select": "^5.1.0",
"react-native-popup-menu": "^0.12.4",
"react-native-pulse": "^1.0.6",
"react-native-scrollable-tab-view": "^0.8.0",
"react-native-share": "^1.0.26",
"react-native-simple-toast": "0.0.8",
"react-native-snap-carousel": "^3.7.2",
"react-native-splash-screen": "^3.0.6",
"react-native-star-rating": "^1.0.9",
"react-native-swipe-cards": "^0.1.1",
"react-native-swipe-list-view": "^1.0.7",
"react-native-swipeable-flat-list": "0.0.5",
"react-native-swipeout": "^2.3.3",
"react-native-switch": "^1.4.0",
"react-native-twitter-signin": "github:GoldenOwlAsia/react-native-twitter-signin#master",
"react-native-view-more-text": "^2.0.1",
"react-native-viewpager": "^0.2.13",
"react-navigation": "^1.0.3",
"rn-viewpager": "^1.2.9"
},
"devDependencies": {
"babel-jest": "22.2.2",
"babel-plugin-transform-decorators-legacy": "^1.3.4",
"babel-preset-react-native": "4.0.0",
"jest": "22.2.2",
"react-test-renderer": "16.2.0"
},
"jest": {
"preset": "react-native"
}
}
I finally solved this by installing this package: #babel/plugin-proposal-decorators and removing this one: babel-plugin-transform-decorators-legacy
And finally changing the plugins section of my .babelrc to this:
{
"presets": ["react-native"],
"plugins": [
["#babel/plugin-proposal-decorators", {"legacy": true}]
]
}