Can't resolve error: package android.support.design.widget does not exist issue

Question

Having difficulties getting an Ionic project to build on Android when using the Capacitor AdMob plugin.

The forth line of the AdMob.java file has this line:

import android.support.design.widget.CoordinatorLayout;

with an error on design saying Cannot resolve symbol 'design' and a build error of error: package android.support.design.widget does not exist

I've added this line to my build.gradle file and it's made no difference. implementation 'com.android.support:design:28.0.0'

I'm having to use AndroidX due to another plugin but migrating using the migrate function in Android Studio doesn't help.

Is this long term issue or just my mistake somewhere (I have a web dev and iOS Swift background so building Android projects is quite alien to me, hence using Ionic)

Thanks

my build.gradle file is (I undid the AndroidX migrate since it didn't help)

apply plugin: 'com.android.application'

android {
    compileSdkVersion 28
    defaultConfig {
        applicationId "com.skbarker.calwod"
        minSdkVersion 21
        targetSdkVersion 28
        versionCode 1
        versionName "1.0"
        testInstrumentationRunner "android.support.test.runner.AndroidJUnitRunner"
    }
    buildTypes {
        release {
            minifyEnabled false
            proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'
        }
    }
}

repositories {
    maven {
        url  "https://dl.bintray.com/ionic-team/capacitor"
    }
    flatDir{
        dirs '../capacitor-cordova-android-plugins/src/main/libs', 'libs'
    }
}

dependencies {
    implementation fileTree(include: ['*.jar'], dir: 'libs')
    implementation project(':capacitor-android')
    testImplementation 'junit:junit:4.12'
    androidTestImplementation 'com.android.support.test:runner:1.0.2'
    androidTestImplementation 'com.android.support.test.espresso:espresso-core:3.0.2'
    implementation project(':capacitor-cordova-android-plugins')
}

apply from: 'capacitor.build.gradle'

try {
    def servicesJSON = file('google-services.json')
    if (servicesJSON.text) {
        apply plugin: 'com.google.gms.google-services'
    }
} catch(Exception e) {
    logger.warn("google-services.json not found, google-services plugin not applied. Push Notifications won't work")
}

Answer 1

Run

npm install jetifier
npx jetify
npx cap sync android

These commands will replace AdMob.java's line 4

import android.support.design.widget.CoordinatorLayout;

to

import androidx.coordinatorlayout.widget.CoordinatorLayout;

Then open up Android Studio, shift+shift to open up AdMob.java, and click the red underlined CoordinatorLayout to import the package.

Answer 2

The following steps solved this issue for me:

1. Upgrade Capacitor to 2.0.0 (currently only version beta.1 is available so we have to upgrade it manually)

   npm install @capacitor/android@next
   npm install @capacitor/core@next
   

2. Remove the android folder (simply rename it to have a backup) and add it again via Capacitor

   ionic capacitor add android
   

3. Generate a fresh build, open it in Android Studio and run

   Refactor > Migrate to AndroidX
   

Answer 3

Ended up having to do quite the involved process helped by someone on this issue I raised on the AdMob repo, pretty poor support from Ionic forum in the end sadly.

https://github.com/rahadur/capacitor-admob/issues/35

Answer 4

npm install jetifier
npx jetify
npx cap sync android

as mentioned in the previous answer then migrate your android project to androidx one (refactor from the menu bar)