Fix for older react-native (< 0.63) - react-native

The fix above only works on gradle 6.2 and higher. Older react-native used older gradle.
You may determine your gradle version by looking in your /android/gradle/wrapper/gradle-wrapper.properties file.
If you are on an older version of react-native (for example 0.63 or earlier) that uses gradle version 6.1 or below, you must use a different workaround as gradle 6.1 does not support exclusiveContent.
Add this in the allprojects area of your android/build.gradle file.
def REACT_NATIVE_VERSION = new File(['node', '--print',"JSON.parse(require('fs').readFileSync(require.resolve('react-native/package.json'), 'utf-8')).version"].execute(null, rootDir).text.trim())
allprojects {
configurations.all {
resolutionStrategy {
// Remove this override in 0.65+, as a proper fix is included in react-native itself.
force "com.facebook.react:react-native:" + REACT_NATIVE_VERSION
}
}
Instead of using exclusiveContent, the hotfix must force the version of React Native. The recommended hotfix shells out to node to read your current version of react-native. If you hard code the version of react-native, when you upgrade your project in the future, your build will fail if you forget to remove this hotfix.
Note that this fix is fragile as the location of your package.json could be different if you are in a monorepo, and node might not be available if you use a node package manager like nvm.
fix issue when use react-native < 0.63

Related

react-native - Upgrading to Gradle 7 breaks project

react-native: 0.66.4
Upgraded:
Gradle Plugin from 4.2.2 to 7.0.2
Gradle from 6.9.0 to 7.2.0
When running react-native run-android got:
FAILURE: Build completed with 2 failures.
1: Task failed with an exception.
-----------
* Where:
Build file '/Users/chen.oppenhaim/dev/toluna-mobile-app/mobile-apps/node_modules/react-native-rate/android/build.gradle' line: 41
* What went wrong:
A problem occurred evaluating project ':react-native-rate'.
> Plugin with id 'maven' not found.
Its seems that now one of my react-native packages (react-native-rate) is not compatible with Gradle 7.
I guess that once I fixed this issue - other packages as well will have incompatibilities issues as well.
How should I approach this issue?
android/build.gradle (Gradle plugin version):
buildscript {
dependencies {
classpath('com.android.tools.build:gradle:7.0.2')
}
}
gradle-wrapper.properties (Gradle version):
distributionUrl=https\://services.gradle.org/distributions/gradle-7.2-bin.zip
Finally solved it.
Those Gradle plugin and Gradle upgrades are possible in react-native project but keep in mind that other react-native packages in your project might not be compatible with Gradle 7.
Specific for the error I got - upgrading react-native-rate to latest version solve the issue - but it was not the only upgrade I needed to do - so you can expect that (overall 4 upgrades).
Also not sure What I gain from this Gradle upgrade but this is another discussion.

How to clear gradle to reinstall npm package (React Native Android)

I have an issue with an npm package react-native-video where it says 'no variant found for :react-native-video.' I've tried uninstalling and reinstalling, deleting node_modules and yarn.lock and clearing gradle, invalidating caches and restarting Android Studio, and any permutation of the above things.
The app builds and syncs perfectly find without react-native-video, but any time I reinstall it and add the files back in the app.gradle and other files (per the installation instructions) it gives me the same error. Has anyone had this issue before, and how do you fix it? I'm assuming it's an Android Studio/Gradle issue, but I'm at a complete loss as to how to fix it.
Please check your version of React Native and react-native-video.
In my case, I use React Native 0.64.1 and react-native-video 5.1.1, and it works well.
Other solution
Assuming you are on a later version of React Native, In android/build.gradle you need to add jcenter(), in this case best to be explicit and only include what is necessary:
...
allprojects {
repositories {
... other repositories
jcenter() {
content {
includeModule("com.yqritc", "android-scalablevideoview")
}
}
}
}

react-native-maps production: app crashes when opening basic <Mapview/>

I am unable to integrate react-natives-maps in a production build as I am unsure how to set it up with expo and react native 0.61.
Am I supposed to create a android/build.gradle file to make this work? Till now I wasn't needing this file as everything is handled by expo. I also don't have any other files in the android/ folder. This is the build.gradle that I have added:
buildscript {
repositories {
google()
jcenter()
}
dependencies {
classpath 'com.android.tools.build:gradle:3.5.2'
classpath 'de.undercouch:gradle-download-task:4.0.0'
implementation(project(':react-native-maps')){
exclude group: 'com.google.android.gms', module: 'play-services-base'
exclude group: 'com.google.android.gms', module: 'play-services-maps'
}
implementation 'com.google.android.gms:play-services-base:10.0.1'
implementation 'com.google.android.gms:play-services-maps:10.0.1'
}
}
allprojects {
repositories {
google()
jcenter()
}
}
but I am actually unsure whether this file is used at all when I run expo build:android.
I have created the gradle file according to the installation instructions here, specifically for the 0.61 version.
When I open the APK-file after running expo build:android the screen simply crashes which make me think somehow react-native-maps is not linked properly. I am not getting any error as the app simply restart.
Depending on how you have created your react-native project with Expo will determine what folders are available and how you install dependencies.
By default Expo abstracts away the native iOS and Android code so that you do not have to worry about it.
As you project does not have and ios and android folders, this means that you are using a managed workflow which means you cannot install dependencies that add native code.
Expo provides MapView which is what you are looking for. You can install it by following the instructions here.
Basically, as you are using a managed workflow, you should use:
expo install react-native-maps
You shouldn't be adding ios or android folders to a managed workflow application as that won't do anything.

Cannot build react-native-elements due to old react-native-vector-icons version

A recent removal of old gradle repos by Google has crippled older versions of some repositories, including react-native-vector-icons before version 6.1.
The react-native-elements library uses version 4.4.2 of this library. Is there a graceful way (that is, other than hand-modifying the contents of the repo in node_modules) to overcome this problem without waiting for a new release of react-native-elements?

How to get react-native init to use most recent version of build tools

When I created an app using "react-native init MyApp", it created files that specify build tools version 23.0.1. I ended up with the same problem as this person:
React Native on Android failed to find Build Tools
23.0.1 is an older version of the build tools, and I'm thinking I should use the most recent one. I did a search for the term "23.0.1" in the project, and found that that version is specified not only in the top-level build.gradle, but also in all of the modules under /node_modules.
Questions:
If I fix the top-level build.gradle, do I have to fix all the modules as well?
Is there a command line react-native init param I can use to do it automatically? (I can't find documention on it.)
Or should I not use the more recent versions and just install 23.0.1?
(I'm developing on Windows 10, if that matters.)