Trying to add MultiDex support - cannot find symbol context and MultiDex

Question

After following the instructions mentioned at: https://developer.android.com/studio/build/multidex.html#mdex-gradle

I am getting an error cannot find symbol class Context variable context and variable MultiDex.

package com.mycompany.mypackage;

import android.app.Application;
import android.util.Log;

import com.facebook.react.ReactApplication;
import com.slowpath.hockeyapp.RNHockeyAppModule;
import com.slowpath.hockeyapp.RNHockeyAppPackage;
import com.microsoft.codepush.react.CodePush;
import com.facebook.react.ReactInstanceManager;
import com.facebook.react.ReactNativeHost;
import com.facebook.react.ReactPackage;
import com.facebook.react.shell.MainReactPackage;

import com.sbugert.rnadmob.RNAdMobPackage;

import com.lugg.ReactNativeConfig.ReactNativeConfigPackage;

import com.geektime.reactnativeonesignal.ReactNativeOneSignalPackage;
import com.dieam.reactnativepushnotification.ReactNativePushNotificationPackage;

import com.reactnative.ivpusic.imagepicker.PickerPackage;

import com.github.xinthink.rnmk.ReactMaterialKitPackage;

import com.learnium.RNDeviceInfo.RNDeviceInfo;

import com.burnweb.rnpermissions.RNPermissionsPackage;

import net.zubricky.AndroidKeyboardAdjust.AndroidKeyboardAdjustPackage;

// react-native-fbsdk
import com.facebook.CallbackManager;
import com.facebook.FacebookSdk;
import com.facebook.reactnative.androidsdk.FBSDKPackage;
import com.facebook.appevents.AppEventsLogger;
// react-native-fbads
import io.callstack.react.fbads.FBAdsPackage;

import java.util.Arrays;
import java.util.List;

public class MainApplication extends Application implements ReactApplication {
  @Override
  protected void attachBaseContext(Context base) {
     super.attachBaseContext(context);
     MultiDex.install(this);
  }


  // react-native-fbsdk
  private static CallbackManager mCallbackManager = CallbackManager.Factory.create();
  protected static CallbackManager getCallbackManager() {
    return mCallbackManager;
  }
  @Override
  public void onCreate() {
    super.onCreate();
    FacebookSdk.sdkInitialize(getApplicationContext());
    // If you want to use AppEventsLogger to log events.
    AppEventsLogger.activateApp(this);
  }

  private final ReactNativeHost mReactNativeHost = new ReactNativeHost(this) {

    @Override
    protected String getJSBundleFile() {
      return CodePush.getJSBundleFile();
    }

    @Override
    protected boolean getUseDeveloperSupport() {
      return BuildConfig.DEBUG;
    }

    @Override
    protected List<ReactPackage> getPackages() {
      return Arrays.<ReactPackage>asList(
          new MainReactPackage(),
          new RNHockeyAppPackage(MainApplication.this),
          new CodePush("mykey", MainApplication.this, BuildConfig.DEBUG),
          new ReactNativeConfigPackage(),
          new ReactNativeOneSignalPackage(),
          new ReactNativePushNotificationPackage(),
          new RNAdMobPackage(),
          new PickerPackage(),
          new ReactMaterialKitPackage(),
          new RNDeviceInfo(),
          new RNPermissionsPackage(),
          new AndroidKeyboardAdjustPackage(),
          new FBSDKPackage(mCallbackManager),
          new FBAdsPackage()
      );
    }

  };

  @Override
  public ReactNativeHost getReactNativeHost() {
      return mReactNativeHost;
  }
}

build.gradle

dependencies {
    compile project(':react-native-device-info')
    compile project(':react-native-hockeyapp')
    compile project(':react-native-code-push')
    compile project(':react-native-image-crop-picker')
    compile project(':react-native-vector-icons')
    compile project(':react-native-material-kit')
    compile project(':react-native-config')
    compile project(':RNAdMob')
    compile project(':react-native-onesignal')
    compile project(':react-native-push-notification')
    compile project(':RNPermissionsModule')
    compile project(':react-native-android-keyboard-adjust')
    compile project(':react-native-fbsdk')
    compile(project(':react-native-fbads')) {
      exclude group: "com.google.android.gms"
    }
    compile 'com.google.firebase:firebase-core:10.2.0'
    compile 'com.google.firebase:firebase-crash:10.2.0'
    compile 'com.google.firebase:firebase-ads:10.2.0'

    compile fileTree(dir: "libs", include: ["*.jar"])
    compile "com.android.support:appcompat-v7:23.0.1"
    compile "com.facebook.react:react-native:+"  // From node_modules
    compile "com.facebook.fresco:animated-gif:0.12.0"
    compile 'com.android.support:multidex:1.0.1'
}

Is there something I have to add or import to get this to work?

Answer 1

For those who get cannot find symbol error, the following is stated in the official android developer documents:

If your minSdkVersion is 21 or higher multidex is enabled by default, and you do not need the multidex support library.

Answer 2

If you are using RN > 0.60 and androidx support, you may add,

import androidx.multidex.MultiDex;