I'm making an application in react native and I need to update it to use version 31 of the Android SDK due to the requirements of the Google Play Store. I was using version 30.
When trying to update android/build.gradle (below) with sdk 31 and build tools 31 (I already found the fix for the build tool 31 corruption error) I got the android:exported error even after adding it to my AndroidManifest .xml (below). After many tests I was able to successfully build and install the app by updating react-native-onesignal from version 4.0.2 to version 4.2.0, but the application no longer opens. It doesn't even try to connect with Metro, it just flashes a gray screen for less than 1 second and then closes. Does anyone know what it could be?
android/build.gradle
`
// Top-level build file where you can add configuration options common to all sub-projects/modules.
buildscript {
ext {
buildToolsVersion = "30.0.2"
minSdkVersion = 21
compileSdkVersion = 30
targetSdkVersion = 30
ndkVersion = "21.4.7075529"
kotlinVersion = "1.6.0"
}
repositories {
google()
mavenCentral()
}
dependencies {
classpath("com.android.tools.build:gradle:4.2.2")
classpath 'com.google.gms:google-services:4.3.10'
// NOTE: Do not place your application dependencies here; they belong
// in the individual module build.gradle files
}
}
allprojects {
repositories {
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")
}
mavenCentral {
// We don't want to fetch react-native from Maven Central as there are
// older versions over there.
content {
excludeGroup "com.facebook.react"
}
}
google()
maven { url 'https://www.jitpack.io' }
}
}
AndroidManifest.xml
`
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="com.appopaprofessional">
<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" />
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
<uses-permission android:name="android.permission.DOWNLOAD_WITHOUT_NOTIFICATION" />
<application
android:name=".MainApplication"
android:label="#string/app_name"
android:icon="#mipmap/ic_launcher"
android:roundIcon="#mipmap/ic_launcher_round"
android:allowBackup="false"
android:theme="#style/AppTheme">
<activity
android:name=".MainActivity"
android:exported="true"
android:label="#string/app_name"
android:configChanges="keyboard|keyboardHidden|orientation|screenSize|uiMode"
android:launchMode="singleTask"
android:windowSoftInputMode="adjustResize">
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
<action android:name="android.intent.action.DOWNLOAD_COMPLETE"/>
</intent-filter>
</activity>
<meta-data android:name="com.facebook.sdk.ApplicationId" android:value="#string/facebook_app_id"/>
<meta-data android:name="com.facebook.sdk.ClientToken" android:value="#string/facebook_client_token"/>
<meta-data android:name="com.google.android.geo.API_KEY" android:value="AIzaSyCDMXGqsxr_IuwMiPoRTzrZ_fD09WYT7E8"/>
</application>
<uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" />
</manifest>
package.json
`
{
"name": "AppOpaProfessional",
"version": "1.3.1.5",
"private": true,
"scripts": {
"android": "react-native run-android",
"android-release-apk": "react-native run-android --variant=release",
"ios": "react-native run-ios",
"start": "react-native start",
"test": "jest",
"lint": "eslint .",
"clean": "react-native-clean-project"
},
"dependencies": {
"#hookform/error-message": "^1.1.0",
"#hookform/resolvers": "^2.9.10",
"#invertase/react-native-apple-authentication": "^2.1.5",
"#react-native-async-storage/async-storage": "^1.16.1",
"#react-native-community/masked-view": "^0.1.10",
"#react-native-community/netinfo": "^6.2.1",
"#react-native-community/toolbar-android": "^0.2.1",
"#react-native-firebase/app": "^14.2.2",
"#react-native-firebase/auth": "^14.2.2",
"#react-native-firebase/firestore": "^14.2.2",
"#react-native-firebase/functions": "^14.2.2",
"#react-native-firebase/storage": "^14.2.2",
"#react-native-google-signin/google-signin": "^7.1.0",
"#react-navigation/drawer": "^6.3.1",
"#react-navigation/material-top-tabs": "^6.1.1",
"#react-navigation/native": "^6.0.8",
"#react-navigation/native-stack": "^6.5.0",
"#types/styled-components-react-native": "^5.1.3",
"formik": "^2.2.9",
"geolib": "^3.3.1",
"jest-haste-map": "^26.6.2",
"jest-serializer": "^26.6.2",
"jest-worker": "^26.6.2",
"jetifier": "^1.6.6",
"lodash": "^4.17.21",
"moment": "^2.29.1",
"numbro": "^2.3.2",
"react": "17.0.2",
"react-hook-form": "^7.39.1",
"react-native": "0.66.4",
"react-native-blob-util": "^0.16.3",
"react-native-chart-kit": "^6.11.0",
"react-native-circular-progress": "^1.3.7",
"react-native-confirmation-code-field": "^6.5.1",
"react-native-credit-card-input": "^0.4.1",
"react-native-date-picker": "^3.2.10",
"react-native-datepicker": "^1.7.2",
"react-native-device-info": "^8.0.8",
"react-native-document-picker": "^8.1.2",
"react-native-easy-grid": "^0.2.2",
"react-native-fbsdk-next": "6.2.0",
"react-native-file-picker": "^0.0.20",
"react-native-geocoding": "^0.5.0",
"react-native-geolocation-service": "^5.2.0",
"react-native-gesture-handler": "^2.4.1",
"react-native-gifted-chat": "^0.16.3",
"react-native-google-maps-directions": "^2.1.1",
"react-native-google-places-autocomplete": "^2.4.1",
"react-native-image-picker": "^4.7.3",
"react-native-image-view": "^2.1.9",
"react-native-indicators": "^0.17.0",
"react-native-linear-gradient": "^2.5.6",
"react-native-loading-spinner-overlay": "^2.0.0",
"react-native-maps": "0.30.1",
"react-native-maps-directions": "^1.8.0",
"react-native-masked-text": "^1.13.0",
"react-native-material-dropdown-v2": "^0.11.1",
"react-native-material-menu": "^1.2.0",
"react-native-modal-filter-picker": "^2.0.0",
"react-native-onesignal": "4.0.1",
"react-native-pager-view": "^5.4.9",
"react-native-paper": "^4.12.0",
"react-native-pdf": "^6.6.2",
"react-native-popup-dialog": "^0.18.3",
"react-native-pulse": "^1.0.7",
"react-native-ratings": "^8.1.0",
"react-native-reanimated": "^2.4.1",
"react-native-render-html": "^5.1.0",
"react-native-safe-area-context": "^3.3.2",
"react-native-screen": "^1.0.1",
"react-native-screens": "^3.10.1",
"react-native-select-dropdown": "^1.13.0",
"react-native-select-multiple": "^2.1.0",
"react-native-share": "^5.1.7",
"react-native-slowlog": "^1.0.2",
"react-native-social-buttons": "^1.2.0",
"react-native-step-indicator": "^1.0.3",
"react-native-svg": "^12.1.1",
"react-native-swiper": "^1.6.0",
"react-native-tab-view": "^3.1.1",
"react-native-uuid": "^2.0.0",
"react-native-vector-icons": "9.1.0",
"react-native-webview": "^11.17.2",
"react-redux": "^7.2.6",
"redux": "^4.1.2",
"redux-thunk": "^2.4.1",
"rn-fetch-blob": "^0.12.0",
"styled-components": "^5.3.3",
"victory-native": "^36.2.0",
"yup": "0.32.11"
},
"devDependencies": {
"#babel/core": "^7.16.7",
"#babel/runtime": "^7.16.7",
"#react-native-community/eslint-config": "^3.0.1",
"babel-jest": "^27.4.6",
"eslint": "^7.32.0",
"jest": "^27.4.7",
"metro-react-native-babel-preset": "^0.66.2",
"react-native-clean-project": "^3.6.7",
"react-test-renderer": "17.0.2",
"uuid": "^8.3.2"
},
"jest": {
"preset": "react-native"
}
}
I tried to update all dependencies to newer versions but the error persisted.
add this to you app/build.gradle dependencies.
dependencies {
...
implementation "androidx.work:work-runtime:$rootProject.ext.work_version"
implementation "androidx.work:work-runtime-ktx:$rootProject.ext.work_version"
...
}
after that update reanimated and gesture-handler to the latest version.
Related
I'm trying to use to build an Android APK in my React Native app having expo installed. I've tried in many ways... and always had the same problem telling that some package from Android doesn't exist. This is only a example because the error is replicated with many Android packages.
> Task :expo-modules-core:compileReleaseJavaWithJavac
[stderr] /home/expo/workingdir/build/node_modules/expo-modules-core/android/src/main/java/expo/modules/core/ViewManager.java:3:
error: package android.content does not exist
[stderr] import android.content.Context;
I think this error could be related with versions or versions configuration. I don't know if it could be Java SKD, Expo or something like that.
If anyone could help me please!!
openjdk version "11.0.15" 2022-04-19 LTS
OpenJDK Runtime Environment Zulu11.56+19-CA (build 11.0.15+10-LTS)
OpenJDK 64-Bit Server VM Zulu11.56+19-CA (build 11.0.15+10-LTS, mixed mode)
package.json
{
"name": "AppNative",
"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 . --ext .js,.jsx,.ts,.tsx",
"storybook": "start-storybook -p 6006",
"build-storybook": "build-storybook",
"format:all": "eslint . --fix && prettier . --write",
"prepare": "husky install"
},
"dependencies": {
"#react-navigation/native": "^6.0.10",
"#react-navigation/native-stack": "^6.6.2",
"#storybook/addon-knobs": "^6.4.0",
"#types/react-native": "^0.67.3",
"expo": "^45.0.6",
"expo-dev-client": "~1.0.0",
"expo-device": "~4.2.0",
"expo-notifications": "~0.15.4",
"expo-updates": "~0.13.4",
"native-base": "^3.4.7",
"react": "17.0.1",
"react-native": "0.68.2",
"react-native-safe-area-context": "^3.2.0",
"react-native-screens": "^3.13.1",
"react-native-svg": "^12.1.1",
"react-native-webview": "^11.22.4",
"webpack-merge": "^5.8.0"
},
"devDependencies": {
"#babel/core": "^7.16.0",
"#babel/helper-builder-react-jsx-experimental": "^7.12.11",
"#babel/plugin-proposal-private-property-in-object": "^7.16.7",
"#babel/runtime": "^7.14.0",
"#react-native-community/eslint-config": "^2.0.0",
"#storybook/addon-actions": "^6.4.20",
"#storybook/addon-essentials": "^6.4.20",
"#storybook/addon-interactions": "^6.4.20",
"#storybook/addon-links": "^6.4.20",
"#storybook/addon-react-native-web": "^0.0.18",
"#storybook/react": "^6.4.20",
"#storybook/testing-library": "^0.0.9",
"#types/jest": "^27.4.1",
"#types/react": "^17.0.43",
"#types/react-test-renderer": "^17.0.1",
"#typescript-eslint/eslint-plugin": "^5.30.0",
"#typescript-eslint/parser": "^5.30.0",
"babel-jest": "^26.6.3",
"babel-loader": "^8.2.2",
"babel-plugin-react-native-web": "^0.17.7",
"eslint": "^8.18.0",
"eslint-config-prettier": "^8.5.0",
"eslint-config-standard": "^17.0.0",
"eslint-plugin-import": "^2.26.0",
"eslint-plugin-n": "^15.2.3",
"eslint-plugin-promise": "^6.0.0",
"eslint-plugin-react": "^7.30.1",
"eslint-plugin-simple-import-sort": "^7.0.0",
"eslint-plugin-storybook": "^0.5.7",
"husky": ">=7",
"jest": "^26.6.3",
"lint-staged": ">=10",
"metro-react-native-babel-preset": "^0.66.0",
"prettier": "^2.7.1",
"react-dom": "^17.0.0",
"react-native-web": "^0.17.7",
"react-test-renderer": "17.0.1",
"typescript": "^4.6.3"
},
"resolutions": {
"#types/react": "^17"
},
"jest": {
"preset": "react-native",
"moduleFileExtensions": [
"ts",
"tsx",
"js",
"jsx",
"json",
"node"
]
},
"lint-staged": {
"*.{js,ts,jsx,tsx,css,scss,md}": [
"prettier --write",
"eslint --fix"
]
},
"husky": {
"hooks": {
"pre-commit": "lint-staged"
}
}
}
After 3 days of searching... I finally found a solution in this github issue.
https://github.com/expo/expo/issues/17862
As #Kudo says to solve the issue I was using another gradle build version. So I had to change it in my build.gradle file. Make sure is 7.0.4
android/build.gradle
dependencies {
classpath('com.android.tools.build:gradle:7.0.4')
}
I am working on a react-native app. The app is running perfectly in android and IOS below 13 version, but it crashes on devices with IOS 13 and above. I don't get any error or warning while running in IOS 13 version device.
I don't know which package is not supported on the IOS 13 version devices.
Here is my package.json, which of these is causing the problem?
{
"name": "Reapp",
"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 .",
"build-release": "react-native run-android --variant=release && open android/app/build/outputs/apk/release",
"reverse": "adb reverse tcp:8081 tcp:8081 && adb reverse tcp:9090 tcp:9090",
"clean": "cd android && gradlew clean && cd ..",
"cleanrun": "cd android && gradlew clean && cd .. && react-native run-android",
"delbuild": "rmdir android\\app\\build /s /q",
"tron-emulator": "node ReactotronEmulator.js",
"tron-device": "node ReactotronDevice.js",
"debug-build": "react-native bundle --dev false --platform android --entry-file index.js --bundle-output ./android/app/build/intermediates/assets/debug/index.android.bundle --assets-dest ./android/app/build/intermediates/res/merged/debug && cd android && gradlew assembleDebug && cd ..",
"select": "node firebaseEnv"
},
"rnpm": {
"assets": [
"src/assets/fonts/"
]
},
"dependencies": {
"#invertase/react-native-apple-authentication": "^1.1.2",
"#react-native-community/async-storage": "^1.7.1",
"#react-native-community/netinfo": "^4.7.0",
"#react-native-community/push-notification-ios": "^1.0.5",
"#react-native-community/viewpager": "^3.3.0",
"#react-native-firebase/analytics": "^6.2.0",
"#react-native-firebase/app": "^6.2.0",
"#react-native-firebase/auth": "^6.2.0",
"amazon-cognito-identity-js": "^4.2.1",
"aws-amplify": "^3.0.8",
"aws-appsync": "^3.0.2",
"axios": "^0.19.0",
"eslint": "^6.8.0",
"geolib": "^3.2.0",
"graphql-tag": "^2.10.0",
"instabug-reactnative": "^9.0.1",
"lodash": "^4.17.10",
"moment": "^2.22.2",
"prop-types": "^15.6.2",
"react": "16.9.0",
"react-apollo": "^2.3.3",
"react-native": "0.61.5",
"react-native-appstore-version-checker": "^2.7.2",
"react-native-barcode-builder": "^1.0.5",
"react-native-beacons-manager": "git://github.com/MacKentoch/react-native-beacons-manager.git#53c1bda",
"react-native-bluetooth-status": "^1.3.0",
"react-native-camera": "^3.15.0",
"react-native-device-info": "^2.2.1",
"react-native-easy-toast": "^1.2.0",
"react-native-exit-app": "^1.0.0",
"react-native-fbsdk": "^1.1.1",
"react-native-floating-action": "^1.19.1",
"react-native-geolocation-service": "^3.1.0",
"react-native-gesture-handler": "^1.5.3",
"react-native-image-picker": "^0.26.10",
"react-native-image-placeholder": "^1.0.14",
"react-native-immediate-phone-call": "^1.0.0",
"react-native-in-app-utils": "^6.0.2",
"react-native-linear-gradient": "^2.5.6",
"react-native-modal": "^6.5.0",
"react-native-onesignal": "^3.6.1",
"react-native-pdf": "^5.0.9",
"react-native-pulse": "^1.0.7",
"react-native-push-notification": "^3.1.9",
"react-native-qr-generator": "^1.0.4",
"react-native-reanimated": "^1.7.0",
"react-native-responsive-screen": "^1.2.0",
"react-native-splash-screen": "^3.2.0",
"react-native-swiper": "^1.5.13",
"react-native-system-setting": "^1.7.2",
"react-native-tab-view": "^2.0.1",
"react-native-text": "0.0.8",
"react-native-vector-icons": "^6.6.0",
"react-native-webview": "^8.0.2",
"react-navigation": "^3.2.3",
"react-redux": "^7.1.3",
"redux": "^4.0.4",
"redux-persist": "^6.0.0",
"redux-saga": "^1.1.3",
"rn-fetch-blob": "^0.10.16",
"socket.io-client": "^2.2.0",
"tipsi-stripe": "^7.5.1"
},
"devDependencies": {
"#babel/core": "^7.6.2",
"#babel/runtime": "^7.6.2",
"#react-native-community/eslint-config": "^0.0.5",
"babel-jest": "^24.9.0",
"eslint": "^6.5.1",
"babel-eslint": "^8.2.6",
"metro-react-native-babel-preset": "^0.56.0",
"eslint-config-google": "^0.9.1",
"eslint-plugin-babel": "^5.1.0",
"eslint-plugin-flowtype": "^2.50.0",
"eslint-plugin-react": "^7.10.0",
"jest": "^24.9.0",
"react-test-renderer": "16.9.0",
"reactotron-react-native": "^2.1.0",
"simple-plist": "^1.0.0"
},
"jest": {
"preset": "react-native"
}
}
Try running your app through Xcode. You'll be able to find the full stack-trace of the crash in the log even if you're running it in release mode.
This blog might be helpful.
I am continue developed eCommerce mobile app and my laptop a bit laggy, it reach 30m to build the apps !
How to improve the build time, is that some lib making it heavy or am i doing it wrong?
30min to build: react-native run-android execution time
my spec
Java version: 8
My Machine: Dell Latitude E7440, i5Gen4, 8GB RAM
OS: Linux Ubuntu 18
react-native: 0.59
used dependencies:
"dependencies": {
"#ptomasroos/react-native-multi-slider": "1.0.0",
"#rematch/core": "1.0.6",
"#rematch/persist": "1.1.5",
"autobind-decorator": "2.1.0",
"base-64": "0.1.0",
"crypto-js": "3.1.9-1",
"hoist-non-react-statics": "3.2.1",
"html-entities": "1.2.1",
"i18n-js": "3.2.1",
"lodash": "4.17.4",
"metro-react-native-babel-preset": "0.54.0",
"moment": "2.20.1",
"native-base": "2.7.0",
"next-frame": "0.2.3",
"react": "16.8.3",
"react-native": "0.59.10",
"react-native-autoheight-webview": "1.1.3",
"react-native-branch": "2.3.3",
"react-native-camera": "1.4.3",
"react-native-code-push": "5.6.0",
"react-native-device-info": "2.3.2",
"react-native-exit-app-no-history": "1.0.2",
"react-native-fast-image": "5.2.0",
"react-native-fbsdk": "0.8.0",
"react-native-fetch-polyfill": "1.1.3",
"react-native-firebase": "5.1.1",
"react-native-fs": "2.12.1",
"react-native-google-signin": "1.2.2",
"react-native-i18n": "2.0.10",
"react-native-image-picker": "0.28.0",
"react-native-iphone-x-helper": "1.0.2",
"react-native-looped-carousel": "git+https://github.com/phil-r/react-native-looped-carousel.git#e23e1ad41e67ee9e95558e7df00c364fbb1b688b",
"react-native-maps": "0.24.2",
"react-native-masked-text": "1.9.1",
"react-native-material-textfield": "0.12.0",
"react-native-modal": "6.5.0",
"react-native-modal-datetime-picker": "6.0.0",
"react-native-moengage": "3.0.0",
"react-native-offline": "3.14.1",
"react-native-photo-view": "1.5.2",
"react-native-share": "1.0.23",
"react-native-snackbar": "0.5.3",
"react-native-splash-screen": "3.2.0",
"react-native-star-rating": "1.0.8",
"react-native-webview": "5.12.0",
"react-native-svg": "9.5.1",
"react-navigation": "1.5.2",
"react-navigation-redux-helpers": "1.0.3",
"react-redux": "5.0.6",
"redux": "3.7.2",
"redux-actions": "2.2.1",
"redux-logger": "3.0.6",
"redux-persist": "5.10.0",
"redux-saga": "0.15.6",
"rn-placeholder": "1.2.0",
"rn-viewpager": "1.2.9",
"rollbar-react-native": "0.5.0",
"sendbird": "3.0.64",
"shorthash": "0.0.2",
"url": "0.11.0"
},
"devDependencies": {
"babel-eslint": "10.0.1",
"#babel/core": "7.4.5",
"#babel/runtime": "7.4.5",
"#babel/plugin-proposal-class-properties": "7.4.4",
"appium": "1.8.1",
"appium-doctor": "1.4.3",
"babel-jest": "24.1.0",
"babel-plugin-module-resolver": "3.1.1",
"babel-preset-es2015": "6.24.1",
"enzyme": "3.3.0",
"enzyme-adapter-react-16": "1.1.1",
"jest": "24.1.0",
"jest-serializer-enzyme": "1.0.0",
"jsdom": "11.5.1",
"jsdom-global": "3.0.2",
"metro-react-native-babel-preset": "0.54.0",
"react-addons-test-utils": "15.6.2",
"react-dom": "16.8.3",
"react-native-mock": "0.3.1",
"react-test-renderer": "16.8.3",
"reactotron-react-native": "3.5.0",
"redux-mock-store": "1.4.0",
"wd": "1.4.0",
"why-did-you-update": "1.0.6",
"eslint": "5.16.0",
"eslint-config-airbnb": "17.1.0",
"eslint-config-prettier": "4.1.0",
"eslint-import-resolver-webpack": "0.11.0",
"eslint-plugin-import": "2.16.0",
"eslint-plugin-jsx-a11y": "6.2.1",
"eslint-plugin-prettier": "3.0.1",
"eslint-plugin-react": "7.12.4",
"eslint-plugin-react-hooks": "1.6.0",
"husky": "2.3.0",
"lint-staged": ">=8",
"prettier": "1.16.4",
"prettier-eslint": "8.8.2",
"prettier-eslint-cli": "4.7.1",
"prop-types": "15.7.2"
},
You have some praticle solition as below
your project android/app/build.gradle replace the word compile into implementation in dependencies
In the same file you can update you project build:gradle version like 3.1.3
Update gradle version in android/gradle/wrapper/gradle-wrapper.properties
Also I found this React-native run-android take too much time
if you wanna more information about react native performance you can read this post https://facebook.github.io/react-native/docs/performance
I'm getting an error on iOS only:
TypeError: undefined is not an object (evaluating 'this._callListeners.bind')
This error is located at:
in DrawerLayout (at DrawerView.js:161)
...
Project dependencies:
"dependencies": {
"#babel/runtime": "7.2.0",
"#babel/plugin-proposal-async-generator-functions": "7.2.0",
"#babel/plugin-proposal-class-properties": "7.2.1",
"#babel/plugin-proposal-object-rest-spread": "7.2.0",
"babel-preset-expo": "5.0.0",
"expo": "31.0.2",
"expo-cli": "2.5.0",
"native-base": "2.8.1",
"react": "16.6.3",
"react-native": "0.57.8",
"react-redux": "6.0.0",
"react-navigation": "3.0.8",
"react-native-vector-icons": "6.1.0",
"redux": "4.0.1"
}
This started when I began using react-navigation; but works fine on Android.
Here's the code where we're using react-navigation, this is the main app the imports include the Home and Settings screens:
//imports...
const routes = {
Home: Home,
Settings: Settings
};
const AppNavigator = createDrawerNavigator(routes);
const AppContainer = createAppContainer(AppNavigator);
export default class App extends React.Component {
state = {}
render() {
if (this.state.isReady) {
return (
<AppContainer/>
);
}
else {
return (<Container><Spinner/></Container>);
}
}
componentWillMount() {
this._loadAssets();
}
async _loadAssets() {
await Expo.Font.loadAsync({
Roboto: require("native-base/Fonts/Roboto.ttf"),
Roboto_medium: require("native-base/Fonts/Roboto_medium.ttf")
});
this.setState({ isReady: true });
}
}
I fixed this same error by making the following change to my .babelrc
{
"presets": ["module:metro-react-native-babel-preset"],
"plugins": [
- ["#babel/plugin-proposal-decorators", { "decoratorsBeforeExport": true }]
+ ["#babel/plugin-proposal-decorators", { "legacy": true }]
]
}
My package.json:
"dependencies": {
"axios": "^0.18.0",
"mobx": "^5.8.0",
"mobx-react": "^5.4.3",
"react": "16.6.3",
"react-native": "0.57.8",
"react-native-device-info": "^0.24.3",
"react-native-elements": "^1.0.0-beta5",
"react-native-haptic-feedback": "^1.3.0",
"react-native-svg": "^8.0.10",
"react-native-vector-icons": "^6.0.2",
"react-navigation": "^3.0.9",
"rollbar-react-native": "^0.4.0"
},
"devDependencies": {
"#babel/core": "^7.2.2",
"#babel/plugin-proposal-decorators": "^7.2.3",
"babel-eslint": "^10.0.1",
"babel-jest": "23.6.0",
"eslint": "^5.12.0",
"eslint-config-airbnb": "^17.1.0",
"eslint-config-airbnb-base": "^13.1.0",
"eslint-plugin-import": "^2.14.0",
"eslint-plugin-jsx-a11y": "^6.1.2",
"eslint-plugin-react": "^7.12.3",
"eslint-plugin-react-native": "^3.5.0",
"jest": "23.6.0",
"metro-react-native-babel-preset": "0.51.1",
"react-test-renderer": "16.6.3"
}
I was finally able to get this to work after a lot of iterating through possible solutions.
It looks like I had a few issues - with package version conflicts and .babelrc configuration.
With these I was able to get up and running..
package.json deps:
"dependencies": {
"#babel/plugin-proposal-async-generator-functions": "7.2.0",
"#babel/plugin-proposal-class-properties": "7.2.1",
"#babel/plugin-proposal-decorators": "7.2.0",
"#babel/plugin-proposal-object-rest-spread": "7.2.0",
"#babel/plugin-transform-runtime": "7.2.0",
"#babel/runtime": "7.2.0",
"#react-navigation/core": "3.0.2",
"#react-navigation/native": "3.1.0",
"babel-preset-expo": "5.0.0",
"expo": "31.0.6",
"native-base": "2.10.0",
"react": "16.5.0",
"react-native": "https://github.com/expo/react-native/archive/sdk-31.0.0.tar.gz",
"react-native-vector-icons": "6.1.0",
"react-navigation": "3.0.9",
"react-navigation-drawer": "1.0.5",
"react-redux": "6.0.0",
"redux": "4.0.1"
}
And .babelrc in my root dir:
{
"presets": ["babel-preset-expo"],
"plugins": [
["module-resolver", {
"root": ["./"],
"alias": {
"_framework": "./framework",
"_apps": "./apps"
}
}]
]
}
besides adding the babel plugin I also had to run
expo start --clear
to make it work
I have this a simple app which was created using CRNA which runs fine on iOS but fails on Android.
It seems to be related to the missing JSC on Android OS. I added the "android-jsc" (https://github.com/facebook/android-jsc) dep to the project but nothing changed. What am I missing?
Here is my package.json
{
"name": "app",
"version": "0.1.0",
"private": true,
"devDependencies": {
"babel-plugin-module-resolver": "^2.7.1",
"eslint": "^4.10.0",
"eslint-plugin-react": "^7.4.0",
"jest-expo": "^28.0.0",
"jest-immutable-matchers": "^2.0.1",
"react-native-scripts": "1.14.0",
"react-test-renderer": "16.4.0"
},
"main": "./node_modules/react-native-scripts/build/bin/crna-entry.js",
"scripts": {
"start": "REACT_NATIVE_ENV=development react-native-scripts start",
"eject": "react-native-scripts eject",
"android": "react-native-scripts android",
"ios": "react-native-scripts ios",
"test": "REACT_NATIVE_ENV=test node node_modules/jest/bin/jest.js --watch",
"test_ci": "REACT_NATIVE_ENV=test node node_modules/jest/bin/jest.js"
},
"jest": {
"preset": "jest-expo"
},
"dependencies": {
"jsc-android": "224109.x.x",
"expo": "^29.0.0",
"immutable": "^3.8.2",
"momentjs": "^2.0.0",
"prop-types": "^15.6.1",
"react": "16.3.1",
"react-native": "https://github.com/expo/react-native/archive/sdk-29.0.0.tar.gz",
"react-native-elements": "1.0.0-beta5",
"react-native-keyboard-aware-scroll-view": "^0.4.1",
"react-native-modal-datetime-picker": "^6.0.0",
"react-native-side-menu": "^1.1.3",
"react-native-vector-icons": "^4.6.0",
"react-navigation": "2.0.4",
"react-redux": "^5.0.7",
"redux": "^4.0.0",
"redux-immutablejs": "^0.0.8",
"redux-logger": "^3.0.6",
"redux-thunk": "^2.2.0",
"sentry-expo": "^1.9.0",
"validate": "^4.4.1"
}
}
jsc-android needs manual linking, and isn't compatible with Expo. See if all your dependencies are compatible with Expo. If not, you'll either have to detach to ExpoKit, or look for a compatible substitute.
Edit: Upon inspection, you are installing react-native-vector-icons directly. It needs manual linking, but is included on Expo. Check here for the instructions.