Navigate back to the homepage

How to enable multidex in react native

Infinitbility
React Native
August 9th, 2021 · 1 min read
How to enable multidex in react native

Hello Friends 👋,

Welcome To Infinitbility! ❤️

This tutorial will help you to enable multidex in your react native project, let first understand why we need to enable multidex?

why we need to enable multidex?

When we added many dependencies in our project, it may bump you over the 64k method limit on the Android build system. Once this limit has been reached, you will start to see the following error whilst attempting to build your Android application:

Execution failed for task ':app:mergeDexDebug'.

When we face multidex issues?

your minSdkVersion is set to 21 or higher, multidex is enabled by default and you do not need to enable the multidex.

However, if your minSdkVersion is set to 20 or lower, then you must enable the multidex and make the following modifications to your app project:

How to enable multidex in react native

To enable it’s very simple, follow below three steps and solve your multidex issue

Step 1

First, we have to tell gradle to turn on multidex with a directive.

Open the /android/app/build.gradle file and enable multidex on the defaultConfig.

build.gradle
1android {
2 defaultConfig {
3 // ...
4 multiDexEnabled true // <-- ADD THIS in the defaultConfig section
5 }
6 // ...
7}

Step 2

Second, we have to add multidex dependencies, Open the /android/app/build.gradle file and find dependencies section and add implementation 'androidx.multidex:multidex:2.0.1' dependencies like below.

build.gradle
1dependencies {
2 implementation 'androidx.multidex:multidex:2.0.1' // <-- ADD THIS DEPENDENCY
3}

Step 3

The 3rd step is to alter your android/app/src/main/java/.../MainApplication.java file to extend MultiDexApplication like so:

MainApplication.java

1// ... all your other imports here
2import androidx.multidex.MultiDexApplication; // <-- ADD THIS IMPORT
3
4
5// Your class definition needs `extends MultiDexApplication` like below
6public class MainApplication extends MultiDexApplication implements ReactApplication {

Once added, rebuild your application: npx react-native run-android.

Step 4

Step Four is only for that dev who getting still issues after being done and test step 3.

Due to different versions, maybe you will be getting issues after doing all the above steps.

No worry, Change your multidex dependencies

build.gradle

1dependencies {
2 implementation 'com.android.support:multidex:1.0.3' // <-- CHANGE TO THIS DEPENDENCY
3}

And MainApplication.java file also

MainApplication.java

1// ... all your other imports here
2import android.support.multidex.MultiDexApplication; // <-- CHANGE TO THIS IMPORT

Once added, rebuild your application: npx react-native run-android.

Thanks for Reading…

Join our email list and get notified about new content

No worries, I respect your privacy and I will never abuse your email.

Every week, on Tuesday, you will receive a list of free tutorials I made during the week (I write one every day) and news on other training products I create.

Looking For React Native Tutorial?

we are trying to create the best Tutorial for react native developers.

When you want a daily updates about React Native Tutorial or infinitbility update subscribe to our newsletter.

Read React Native Tutorial

Request New Tutorial or Article on mail [email protected]

Tutorials

React Native

Categories

More articles from Infinitbility

How to disable back button in react native

How to disable back button in react native

React Native disable back button Example

August 8th, 2021 · 1 min read
How to dismiss keyboard in react native

How to dismiss keyboard in react native

React Native keyboard dismiss Example

August 7th, 2021 · 1 min read
© 2020–2021 Infinitbility
About
Link to $https://medium.com/infinitbilityLink to $https://www.facebook.com/InfinitbilityLink to $https://github.com/infinitbilityLink to $https://twitter.com/infinitbilityLink to $https://www.buymeacoffee.com/infinitbilityLink to $mailto:[email protected]