nativescript vue에서 개발할 때 admob 작성하기.


뭐 꼭 vue일때하는건 아니기 때문에 ...


admob을 쓰기 위해서는 우선 플러그인을 설치 해야 한다.


tns plugin add nativescript-admob

글쓰는 현재 기준으로  3.3.2버전이다.


그 후 App_Resources/Android/AndroidManifest.xml에 추가


<application>

  <meta-data android:name="com.google.android.gms.ads.APPLICATION_ID" android:value="애드몹앱아이디" />


그 상태에서 빌드를 해보자.


tns build android


현재 기준으로는 에러가 난다. 


Execution failed for task ':app:processDebugManifest'.

> Manifest merger failed : Attribute application@appComponentFactory value=(andr

oidx.core.app.CoreComponentFactory) from [androidx.core:core:1.0.0] AndroidManif

est.xml:22:18-86

        is also present at [com.android.support:support-compat:28.0.0] AndroidMa

nifest.xml:22:18-91 value=(android.support.v4.app.CoreComponentFactory).

        Suggestion: add 'tools:replace="android:appComponentFactory"' to <applic

ation> element at AndroidManifest.xml:17:2-39:16 to override.


AndroidX관련인거 같은데 디테일하게는 찾아보지 않았다. 그럴 시간적 여유가 없으니 해결방법부터.


tools:replace="android:appComponentFactory"

android:appComponentFactory="whateverString"


이 부분을 Manifest의 <appication 태그에 넣으면 된다고 하였으나 넣고 다시 빌드해도 에러가 나왔다. 갱신이 안되서 그런건지 모르겠지만 되지는 않아서 다른 방법을 찾아봐야 했다.


안드로이드 스튜디오를 쓴다면 메뉴 중 refactor -> Migrate to AndroidX로 하면 해결이 되겠지만 나는 nativescript + vue를 이용하기 때문에 개발 환경을 visual code를 쓰고 있다.


각 프로그램들이 버전이 올라가거나 미래에는 자동으로 수정이 될지 더 다양한 방법이 나올지 모르겠지만 현재 내가 쓰는 버전은 아래와 같다.


tns --version : 5.4.2



여러가지 다양한 시도를 하다가 현재는 이상이 없는 상태라서 적어본다.


1.app/App_Resources/Android에 파일 하나 생성해 준다. before-plugins.gradle

app/App_Resources/Android/before-plugins.gradle이 되겠지.


거기에 아래 코드를 추가하자.


project.ext {

  googlePlayServicesVersion = "15.0.0"

}


dependencies {

  compile 'com.squareup.picasso:picasso:2.71828'

  def googlePlayServicesVersion = project.googlePlayServicesVersion

  compile "com.google.android.gms:play-services-base:$googlePlayServicesVersion"

  compile "com.google.android.gms:play-services-location:$googlePlayServicesVersion"

  def supportVer = "28.0.0"

  compile "com.android.support:support-v4:$supportVer"

  compile "com.android.support:appcompat-v7:$supportVer"

  compile "com.android.support:design:$supportVer"

}



before-plugins.gradle



그리고 재빌드를 해보면 이상 없이 된다.


이것 이외에 추가적으로 뭔가 설정하라고 하는데 나는 위에 까지만 하고 쓰고 있고 현재는 이상이 없는거 같다. 추후 발견 될 수도 있겠지만.


참고한곳 : 

https://issue.life/questions/56654315


아직 해당 플로그인의 이슈엔 답이 없다.


https://github.com/EddyVerbruggen/nativescript-admob/issues/67


위에 두줄추가.

const admob = require("nativescript-admob");

import { isIOS } from "tns-core-modules/platform";


android:appComponentFactory="whateverString" 로 검색해보면 꽤 다양한 방법이 나오기는 한다. 죄다 해보진 않았다.


nativescript-admob 사용법은 아래와 같다.


admob.createBanner({

 testing: true,

 size: admob.AD_SIZE.SMART_BANNER,

 androidBannerId: "애드몹아이디",

 margins: {

    // if both are set, top wins

    //top: 10

    bottom: isIOS ? 50 : 0

  },

  }).then(

     function() {

        console.log("생성 완료);

      },

      function(error) {

         console.log("생성 실패 :  " + error);

       }

    )


현재까진 이상이 없는 듯 하다.



Posted by