Expo standalone apk stucks in spash screen - react-native

I have build the standalone apk using the command "eas build -p android --profile preview", It is working fine on development. But, if we run the apk in real device ny installing the apk, the splash screen alone is rendering for a period of long time.. Any ideas ?
package.json
{
"name": "My_Remainder",
"version": "1.0.0",
"main": "node_modules/expo/AppEntry.js",
"scripts": {
"start": "expo start",
"android": "expo start --android",
"ios": "expo start --ios",
"web": "expo start --web",
"eject": "expo eject"
},
"dependencies": {
"#expo/vector-icons": "^12.0.5",
"#react-native-async-storage/async-storage": "~1.15.0",
"#react-native-masked-view/masked-view": "0.2.6",
"#react-navigation/bottom-tabs": "^6.2.0",
"#react-navigation/drawer": "^6.4.1",
"#react-navigation/native": "^6.0.7",
"#react-navigation/stack": "^6.1.1",
"#sentry/react-native": "^3.4.1",
"expo": "~44.0.0",
"expo-application": "~4.0.1",
"expo-auth-session": "^3.5.0",
"expo-constants": "~13.0.1",
"expo-device": "~4.1.0",
"expo-font": "~10.0.4",
"expo-google-sign-in": "~10.1.0",
"expo-haptics": "~11.1.0",
"expo-linear-gradient": "~11.0.2",
"expo-linking": "~3.0.0",
"expo-random": "~12.1.1",
"expo-sharing": "~10.1.0",
"expo-status-bar": "~1.2.0",
"expo-updates": "~0.11.6",
"expo-web-browser": "~10.1.0",
"moment": "^2.29.1",
"react": "17.0.1",
"react-dom": "17.0.1",
"react-native": "0.64.3",
"react-native-calendar-picker": "^7.1.2",
"react-native-elements": "^3.4.2",
"react-native-gesture-handler": "~2.1.0",
"react-native-keyboard-aware-scroll-view": "^0.9.5",
"react-native-modal": "^13.0.1",
"react-native-reanimated": "~2.3.1",
"react-native-safe-area-context": "^3.4.1",
"react-native-svg": "^12.3.0",
"react-native-web": "0.17.1",
"react-redux": "^7.2.8",
"redux": "^4.1.2",
"redux-thunk": "^2.4.1",
"sentry-expo": "^4.0.0",
"expo-splash-screen": "~0.14.1"
},
"devDependencies": {
"#babel/core": "^7.12.9"
},
"private": true
}

Related

Blank screen after splash in react native eas build, how to debug?

My app runs well in expo go but when I create a apk with eas build it shows a blank screen after splash screen. I created apk with expo 45 build, it was fine.
{
"scripts": {
"start": "expo start",
"android": "expo start --android",
"ios": "expo start --ios",
"web": "expo start --web",
"eject": "expo eject",
"test": "jest --watchAll"
},
"jest": {
"preset": "jest-expo"
},
"dependencies": {
"#expo/samples": "~36.0.0",
"#expo/vector-icons": "^13.0.0",
"#react-native-community/masked-view": "^0.1.11",
"expo": "^47.0.8",
"expo-app-loading": "^2.1.1",
"expo-asset": "^8.7.0",
"expo-constants": "~14.0.2",
"expo-dev-client": "~2.0.1",
"expo-file-system": "~15.1.1",
"expo-font": "~11.0.1",
"expo-intent-launcher": "^10.3.1",
"expo-localization": "~14.0.0",
"expo-sqlite": "~11.0.0",
"expo-updates": "^0.15.6",
"expo-web-browser": "~12.0.0",
"i18next": "^22.4.5",
"js-base64": "3.7.3",
"native-base": "^3.4.25",
"react": "18.1.0",
"react-dom": "18.1.0",
"react-i18next": "^12.1.1",
"react-native": "0.70.5",
"react-native-device-info": "^10.3.0",
"react-native-elements": "^3.4.2",
"react-native-fontawesome": "^7.0.0",
"react-native-gesture-handler": "~2.8.0",
"react-native-permissions": "^3.6.1",
"react-native-reanimated": "~2.12.0",
"react-native-render-html": "^6.3.4",
"react-native-safe-area-context": "4.4.1",
"react-native-screens": "~3.18.2",
"react-native-svg": "^13.4.0",
"react-native-vector-icons": "^9.2.0",
"react-native-view-pdf": "^0.14.0",
"react-native-web": "0.18.10",
"react-native-webview": "11.23.1",
"react-native-youtube-iframe": "^2.2.2",
"react-navigation": "^4.0.5",
"react-navigation-drawer": "^2.2.1",
"react-navigation-stack": "^2.1.0",
"react-navigation-tabs": "^2.5.3",
"watchman": "^1.0.0"
},
"devDependencies": {
"#babel/core": "^7.20.5",
"#types/react": "~18.0.26",
"babel-preset-expo": "~9.2.2",
"jest-expo": "^47.0.1",
"typescript": "~4.9.4"
},
"private": true
}

ERROR Invariant Violation: ViewPropTypes has been removed from React Native after upgrade to sdk 46

I have upgraded my expo app to SDK 46 from 38.
now I get the above error. I have gone through stack answers but most of the solutions refer to index.js which I couldn't find in my project.
use my package json to see any errors need to be fixed.
Any help would be much appreciated.
package JSON
"main": "node_modules/expo/AppEntry.js",
"scripts": {
"start": "expo start",
"android": "expo start --android",
"ios": "expo start --ios",
"web": "expo start --web",
"eject": "expo eject"
},
"dependencies": {
"#eva-design/eva": "^2.1.0",
"#react-native-async-storage/async-storage": "~1.17.3",
"#react-native-community/masked-view": "0.1.10",
"#react-native-community/netinfo": "9.3.0",
"#react-navigation/bottom-tabs": "^5.0.0-alpha.25",
"#react-navigation/drawer": "^5.0.0-alpha.27",
"#react-navigation/material-bottom-tabs": "^5.0.0-alpha.35",
"#react-navigation/material-top-tabs": "^5.0.0-alpha.22",
"#react-navigation/native": "^5.0.0-alpha.18",
"#react-navigation/native-stack": "^5.0.0-alpha.16",
"#react-navigation/stack": "^5.0.0-alpha.43",
"#ui-kitten/components": "^5.1.0",
"#ui-kitten/eva-icons": "^5.1.0",
"expo": "^46.0.0",
"expo-app-auth": "~11.1.0",
"expo-auth-session": "~3.7.1",
"expo-av": "~12.0.4",
"expo-background-fetch": "~10.3.0",
"expo-barcode-scanner": "~11.4.0",
"expo-camera": "~12.3.0",
"expo-cellular": "~4.3.0",
"expo-constants": "~13.2.4",
"expo-device": "~4.3.0",
"expo-google-app-auth": "~8.3.0",
"expo-google-sign-in": "~9.2.1",
"expo-image-picker": "~13.3.1",
"expo-location": "~14.3.0",
"expo-network": "~4.3.0",
"expo-notifications": "~0.16.1",
"expo-permissions": "~13.2.0",
"expo-random": "~12.3.0",
"expo-status-bar": "~1.4.0",
"expo-task-manager": "~10.3.0",
"expo-updates": "~0.14.5",
"expo-web-browser": "~11.0.0",
"firebase": "8.2.3",
"react": "18.0.0",
"react-content-loader": "^6.0.3",
"react-dom": "18.0.0",
"react-native": "0.69.5",
"react-native-animatable": "^1.3.3",
"react-native-dotenv": "^2.5.5",
"react-native-elements": "^3.3.2",
"react-native-gesture-handler": "~2.5.0",
"react-native-paper": "^4.9.2",
"react-native-picker-select": "3.1.2",
"react-native-reanimated": "~2.9.1",
"react-native-safe-area-context": "4.3.1",
"react-native-screens": "~3.15.0",
"react-native-stopwatch-timer": "0.0.21",
"react-native-svg": "12.3.0",
"react-native-tab-view": "^2.15.2",
"react-native-unimodules": "^0.14.10",
"react-native-vector-icons": "^8.1.0",
"react-native-web": "~0.18.7",
"react-navigation": "^4.4.4"
},
"devDependencies": {
"#babel/core": "^7.18.6",
"typescript": "^4.6.3"
},
"private": true
}
The problem lies in the installed packages. To solve it try uninstalling, react-native-unimodules and react-native-stopwatch timer. Remove them from your source code and see if it works!

Upgrading from EXPO SDK 44 to 45. IOS doesn't work but android does

I have just upgraded EXPO SDK from 44 to 45.
The issues that I am having:
When I running the app on IOS the app is now super slow
It also has a strange box shadow that appears on the bottom of the screen.
Keyboard also keeps randomly poping up
The app works perfectly on android which is confusing to me. I haven't changed any of the code and on Expo SDK 44 everything was working.
What I have tried:
Downgrading all the react packages to their previous versions apart from react-native
Checking all API calls. In case there is a fetching issue.
These are all the packages that I am using:
{
"name": "iserve-app",
"version": "1.25.0",
"main": "index.js",
"scripts": {
"start": "expo start",
"android": "expo start --android",
"ios": "expo start --ios",
"web": "expo start --web",
"eject": "expo eject",
"prepare": "husky install",
"lint": "tsc --noemit && eslint --ext .js,.jsx,.ts,.tsx ./",
"prettier-format": "prettier --config .prettierrc '**/*.{json,js,jsx,ts,tsx,css,scss,md}' --write"
},
"dependencies": {
"#fortawesome/fontawesome": "^1.1.8",
"#fortawesome/fontawesome-free-solid": "^5.0.13",
"#fortawesome/fontawesome-svg-core": "^1.2.36",
"#fortawesome/free-solid-svg-icons": "^5.15.4",
"#fortawesome/react-native-fontawesome": "^0.2.7",
"#openspacelabs/react-native-zoomable-view": "^2.0.4",
"#react-native-async-storage/async-storage": "~1.17.3",
"#react-native-community/netinfo": "8.2.0",
"#reduxjs/toolkit": "^1.7.1",
"#sentry/react-native": "^3.2.11",
"#types/expo": "^33.0.1",
"#types/json-bigint": "^1.0.1",
"buffer": "^6.0.3",
"date-fns": "^2.28.0",
"decimal.js": "^10.3.1",
"dotenv": "^14.1.0",
"eslint": "7.28",
"exact-math": "^2.2.3",
"expo": "^45.0.0",
"expo-application": "~4.1.0",
"expo-asset": "~8.5.0",
"expo-barcode-scanner": "~11.3.0",
"expo-battery": "~6.2.0",
"expo-blur": "~11.1.0",
"expo-camera": "~12.2.0",
"expo-constants": "~13.1.1",
"expo-device": "~4.2.0",
"expo-media-library": "~14.1.0",
"expo-notifications": "~0.15.4",
"expo-permissions": "~13.2.0",
"expo-screen-orientation": "~4.2.0",
"expo-sensors": "~11.3.0",
"expo-splash-screen": "~0.15.1",
"expo-status-bar": "~1.3.0",
"expo-updates": "~0.13.4",
"intl": "^1.2.5",
"json-bigint": "^1.0.0",
"lottie-react-native": "5.0.1",
"moment": "^2.29.3",
"native-base": "^3.3.3",
"patch-package": "^6.4.7",
"react": "17.0.2",
"react-dom": "17.0.2",
"react-native": "0.68.2",
"react-native-animated-loader": "^0.0.9",
"react-native-currency-input": "^1.0.1",
"react-native-device-detection": "^0.2.1",
"react-native-flash-message": "^0.2.1",
"react-native-gesture-handler": "~2.2.1",
"react-native-markdown-renderer": "^3.2.8",
"react-native-network-logger": "^1.12.0",
"react-native-pager-view": "5.4.15",
"react-native-safe-area-context": "4.2.4",
"react-native-segmented-control-tab": "^4.0.0",
"react-native-side-drawer": "^1.2.9",
"react-native-svg": "12.3.0",
"react-native-swipe-detect": "^1.0.10",
"react-native-tab-view": "^3.1.1",
"react-native-tableview-simple": "^4.3.1",
"react-native-toast-notifications": "^3.2.3",
"react-native-uuid": "^2.0.1",
"react-native-web": "0.17.7",
"react-redux": "^7.2.6",
"react-router-native": "^6.2.1",
"redux-persist": "^6.0.0",
"semantic-release-expo": "^2.2.3",
"sentry-expo": "^4.0.0",
"xmldom": "^0.6.0"
},
"devDependencies": {
"#babel/core": "^7.12.9",
"#commitlint/cli": "^16.0.2",
"#commitlint/config-conventional": "^16.0.0",
"#semantic-release/changelog": "^6.0.1",
"#semantic-release/git": "^10.0.1",
"#types/react": "^18.0.17",
"#types/react-native": "^0.69.5",
"#types/react-native-dotenv": "^0.2.0",
"#types/react-redux": "^7.1.22",
"#types/react-router-native": "^5.1.3",
"#typescript-eslint/eslint-plugin": "^5.9.1",
"#typescript-eslint/parser": "^5.9.1",
"babel-plugin-module-resolver": "^4.1.0",
"eslint-config-airbnb": "^19.0.4",
"eslint-config-prettier": "^8.3.0",
"eslint-plugin-import": "^2.25.4",
"eslint-plugin-jsx-a11y": "^6.5.1",
"eslint-plugin-prettier": "^4.0.0",
"eslint-plugin-react": "^7.28.0",
"eslint-plugin-react-hooks": "^4.3.0",
"husky": "^7.0.4",
"prettier": "^2.5.1",
"react-native-dotenv": "^3.3.1",
"semantic-release": "^18.0.1",
"semantic-release-slack-bot": "^3.4.1",
"typescript": "~4.3.5"
},
"private": true
}
Box shadow that appears:

how to resolve expo error when running github repo

i had a github repo that i coded a few months back, i tried opening the repo and running it and its not working. Every time i try to run it i keep getting the same error. I tried all the solutions to similar question but none of them work. When i create a new expo project it works, but as soon as i paste my code from my repo i get that error.
here is the error i keep getting:
node_modules/#react-navigation/native/src/index.tsx: [BABEL]
/Users/myname/Desktop/app-frontend/node_modules/#react-
navigation/native/src/index.tsx:
You gave us a visitor for the node type TSInstantiationExpression but it's not a valid type
here is my package.json:
{
"main": "node_modules/expo/AppEntry.js",
"scripts": {
"start": "expo start",
"android": "expo start --android",
"ios": "expo start --ios",
"web": "expo start --web",
"eject": "expo eject"
},
"dependencies": {
"#babel/cli": "^7.17.10",
"#react-native-async-storage/async-storage": "~1.15.0",
"#react-native-community/hooks": "^2.6.0",
"#react-native-community/netinfo": "7.1.3",
"#react-native-masked-view/masked-view": "^0.2.6",
"#react-native-picker/picker": "2.2.1",
"#react-navigation/bottom-tabs": "^5.11.7",
"#react-navigation/native": "^5.9.2",
"#react-navigation/stack": "^5.14.2",
"apisauce": "^2.0.1",
"d3-scale": "^3.2.3",
"d3-shape": "^2.0.0",
"dayjs": "^1.10.4",
"expo": "^44.0.0",
"expo-app-loading": "~1.3.0",
"expo-av": "~10.2.0",
"expo-camera": "~12.1.0",
"expo-constants": "~13.0.0",
"expo-contacts": "~10.1.0",
"expo-image-manipulator": "~10.2.0",
"expo-image-picker": "~12.0.1",
"expo-linking": "~3.0.0",
"expo-local-authentication": "~12.1.0",
"expo-permissions": "~13.1.0",
"expo-secure-store": "~11.1.0",
"expo-status-bar": "~1.2.0",
"formik": "^2.2.6",
"jwt-decode": "^3.1.2",
"lottie-react-native": "5.0.1",
"moment": "^2.29.1",
"react": "17.0.1",
"react-dom": "17.0.1",
"react-native": "https://github.com/expo/react-native/archive/sdk-44.0.0.tar.gz",
"react-native-actionsheet": "^2.4.2",
"react-native-appearance": "~0.3.3",
"react-native-calendars": "^1.1282.0",
"react-native-contacts": "^7.0.4",
"react-native-country-list": "^1.0.10",
"react-native-dynamic": "^1.0.0",
"react-native-elements": "^3.3.0",
"react-native-gesture-handler": "~2.1.0",
"react-native-image-pan-zoom": "^2.1.12",
"react-native-image-zoom-viewer": "^3.0.1",
"react-native-masked-text": "^1.13.0",
"react-native-modal": "^11.10.0",
"react-native-modalize": "^2.0.13",
"react-native-progress": "^4.1.2",
"react-native-reanimated": "~2.3.1",
"react-native-safe-area-context": "3.3.2",
"react-native-screens": "~3.10.1",
"react-native-size-matters": "^0.4.0",
"react-native-skeleton-placeholder": "^3.0.4",
"react-native-snap-carousel": "^3.9.1",
"react-native-svg": "^12.1.1",
"react-native-web": "0.17.1",
"svg-path-properties": "^1.0.11",
"victory-native": "^35.3.1",
"yup": "^0.32.9"
},
"devDependencies": {
"#babel/core": "^7.12.9",
"babel-cli": "^6.26.0"
},
"private": true
}

React Native - Undefined is not an object (evaluating "iter[Symbol.iterator]")

We just sent me a big react native project that I can't open and I can't figure it out why.
I've got the message : "Undefined is not an object (evaluating "Iter[Symbol.iterator]")".
I can't access the app because of it and didn't find any topic that helped me.
Here the package.json :
{
"main": "node_modules/expo/AppEntry.js",
"scripts": {
"start": "expo start",
"android": "expo start --android",
"ios": "expo start --ios",
"web": "expo start --web",
"eject": "expo eject",
"prettier": "prettier --ignore-path .gitignore \"**/*.+(js|jsx|json)\"",
"format": "npm run prettier -- --write",
"lint": "eslint --max-warnings 0 --fix --ext .js,.ts,.tsx .",
"validate": "npm run format && npm run lint"
},
"dependencies": {
"#expo-google-fonts/raleway": "^0.1.0",
"#expo/vector-icons": "^12.0.0",
"#react-native-community/masked-view": "0.1.10",
"#react-native-community/netinfo": "5.9.7",
"#react-native-community/slider": "3.0.3",
"#react-native-picker/picker": "1.9.2",
"#react-navigation/bottom-tabs": "^5.11.8",
"#react-navigation/material-bottom-tabs": "^5.3.14",
"#react-navigation/material-top-tabs": "^5.3.14",
"#react-navigation/native": "^5.9.2",
"#react-navigation/stack": "^5.14.2",
"axios": "^0.21.1",
"date-fns": "^2.19.0",
"expo": "~40.0.0",
"expo-app-loading": "^1.0.1",
"expo-av": "~8.7.0",
"expo-cli": "^4.3.2",
"expo-file-system": "~9.3.0",
"expo-font": "~8.4.0",
"expo-linear-gradient": "~8.4.0",
"expo-media-library": "~10.0.0",
"expo-permissions": "~10.0.0",
"expo-screen-orientation": "~2.1.0",
"expo-status-bar": "~1.0.3",
"expo-video-player": "^1.6.1",
"global": "^4.4.0",
"jwt-decode": "^3.1.2",
"lodash": "^4.17.21",
"react": "16.13.1",
"react-dom": "16.13.1",
"react-hook-form": "^6.15.2",
"react-native": "https://github.com/expo/react-native/archive/sdk-40.0.1.tar.gz",
"react-native-autoheight-webview": "^1.5.8",
"react-native-collapsible": "^1.5.3",
"react-native-dotenv": "^2.5.3",
"react-native-elements": "^3.2.0",
"react-native-gesture-handler": "~1.8.0",
"react-native-iphone-x-helper": "^1.3.1",
"react-native-keyboard-aware-scroll-view": "^0.9.3",
"react-native-modal": "^11.7.0",
"react-native-paper": "^4.7.1",
"react-native-reanimated": "~1.13.0",
"react-native-responsive-screen": "^1.4.2",
"react-native-safe-area-context": "3.1.9",
"react-native-screens": "~2.15.2",
"react-native-sensitive-info": "^5.5.8",
"react-native-shared-element": "0.7.0",
"react-native-tab-view": "^2.15.2",
"react-native-vector-icons": "^8.1.0",
"react-native-video": "^5.1.1",
"react-native-web": "~0.13.12",
"react-native-webview": "11.0.0",
"react-query": "^3.13.0",
"react-redux": "^7.2.2",
"redux": "^4.0.5",
"redux-devtools-extension": "^2.13.8"
},
"devDependencies": {
"#babel/core": "~7.9.0",
"#babel/runtime": "^7.8.4",
"babel-eslint": "^10.1.0",
"eslint": "^7.25.0",
"eslint-config-prettier": "^7.2.0",
"eslint-plugin-prettier": "^3.4.0",
"eslint-plugin-react": "^7.22.0",
"eslint-plugin-react-hooks": "^4.2.0",
"eslint-plugin-react-native": "^3.10.0",
"prettier": "^2.2.1"
},
"husky": {
"hooks": {
"pre-commit": "npm run validate"
}
},
"private": true
}
I just added the packake.json because it is only file i found relevant but tell me If another package needed.
Add this in your index.js:
// index.js
global.Symbol = require('core-js/es6/symbol');
require('core-js/fn/symbol/iterator');
require('core-js/fn/map');
require('core-js/fn/set');
require('core-js/fn/array/find');
The way I see it is that there are certain JS syntaxes that doesn't translate well for android to understand.
Reference link: Github