5

Is @react-native-firebase/admob deprecated? or just.. Why it doesn't work?

I am using @react-native-firebase/admob (https://rnfb-docs.netlify.app/admob/usage). Everything works fine before to use "admob()". When I add admob() to the code appears this error:

"TypeError: (0, _admob.default) is not a function"

Do someone know why?

My code below (basic usage):

import React from 'react';
import { Text, View} from 'react-native';
import admob, { MaxAdContentRating } from '@react-native-firebase/admob';
import { InterstitialAd, RewardedAd, BannerAd, TestIds } from '@react-native- 
firebase/admob';
import { BannerAdSize} from '@react-native-firebase/admob';



class App extends React.Component{

componentDidMount(){

// this was taked of official page: https://rnfb-docs.netlify.app/admob/usage#installation
admob()
  .setRequestConfiguration({
    // Update all future requests suitable for parental guidance
    maxAdContentRating: MaxAdContentRating.PG,

    // Indicates that you want your content treated as child-directed for purposes of COPPA.
    tagForChildDirectedTreatment: true,

    // Indicates that you want the ad request to be handled in a
    // manner suitable for users under the age of consent.
    tagForUnderAgeOfConsent: true,
  })
  .then(() => {
    // Request config successfully set!
  });
 }
render(){
return(
  <View style={{
    alignItems:"center", 
    justifyContent:"center",
    height:"100%"}}>
    <Text style={{color:"black"}}>
      Hola
    </Text>
    <BannerAd 
      unitId={TestIds.BANNER} 
      size={BannerAdSize.FULL_BANNER} />
  </View>
  )
 }
}
 export default App;
Mauro Elias
  • 99
  • 1
  • 7
  • Congrats on solving your bug yourself! My recommendation is to move your answer to the Answer section and mark your own answer as the solution. Currently it still is marked as unsolved! Let me know if you need any help. – Kemal Ahmed Jun 01 '21 at 19:02

4 Answers4

10

Despite @CodeJoe Answer, I still got confused by different Documentations for the React Native Firebase that where around, hence I spend lots of time and energy to get around it.

I open an issue here where is confirmed that Google removed the AdMob Package since v11.5.0.

AdMob is no longer in Firebase APIs, so this module no longer wraps it, there is no documentation to correct. However it did exist as recently as v11.5.0 here and if you browse the repository at that point, you may consider the e2e tests for AdMob at the time a primer on "How To Use AdMob" https://github.com/invertase/react-native-firebase/tree/0217bff5cbbf233d7915efb4dbbdfe00e82dff23/packages/admob/e2e

Please, don't be like me and check the correct Documentation and website:

Correct

https://rnfirebase.io

Wrong Wrong Wrong, this refers to an older verison

https://rnfb-docs.netlify.app

The internet has a long memory, so there are stale copies of the docs out and about yes, but rnfirebase.io is always the official and current doc site

Admob was removed completely from the firebase ecosystem by Google so it does not exist here no. There are some community packages for it, our v11.5 version that has it, and we hope to peel our implementation out and update it for the community but it takes time and we are unfortunately still backlogged on official firebase apis, so it has not happened yet

So for AdMob solution I would use another Library, and use react-native-firebase for the Solutions that they currently provide

Alternative Library (August 2021)

DISCLAIMER

  • React Native Firebase is a great library still for the other packages they provide (Firebase, Analitycs...) and the Admob version 11.5 is still a solution. These are just suggestion for alternatives for Admob.
Federico Baù
  • 6,013
  • 5
  • 30
  • 38
  • Whats the problem to use an old version of firebase if still working perfectly? If you could recommend some package to use admob in react-native I will appreciate it, until there... I will use all firebase of 11.5 – Mauro Elias Aug 09 '21 at 17:56
  • @MauroElias I personally still use the same package my self for the project (even with the version mistmatch 12.0 and 11 and still works). My concern is for a long term solution. If they dont develop anymore (for the moment) soon or later it will become obsolate, hence I would rather stick for a maitain library ( the one that looks juicy and interesting I added in my updated answer. To be honest with you there are no many pakages available. Also, if you got an issue with a maintained project is better to get support. – Federico Baù Aug 09 '21 at 19:25
  • 1
    Sure that @react-native-firebase/admob is not for long term solution but for some time yet it's fine. For this *outdated* package docs are under https://rnfb-docs.netlify.app (it's copy of *outdated* docs) and simply https://rnfirebase.io is no longer for @react-native-firebase/admob. Unfortunately at official (https://rnfirebase.io) is lack of versioning docs... In this case my opinion is - thank God there is copy at https://rnfb-docs.netlify.app :) Thank you the good people for doing this :D – CodeJoe Aug 14 '21 at 06:38
  • 1
    best solution until now +1 – Hisham Aug 14 '21 at 11:40
4

To complete your searching I'll add that Admob is removed from React Native Firebase and there is no plan to implement it again. Only re-host code on an external repository. Last supported version is 11.5.0

It means if you would like to use RN Firebase Admob before re-host you need to use all other services (like RNF analytics) with this version.

For more info please check https://github.com/invertase/react-native-firebase/issues/5329#issuecomment-843272057

Remember to use

dependencies{
   "@react-native-firebase/admob": "11.5.0",
   "@react-native-firebase/app": "11.5.0",
 }

instead of

dependencies{
   "@react-native-firebase/admob": "^11.5.0",
   "@react-native-firebase/app": "^11.5.0",

 }```
CodeJoe
  • 262
  • 2
  • 10
  • Then.. How do you recommend to add Ads with react-native without firebase? I checked many plugins and those are deprecated or with many bugs... – Mauro Elias Jun 06 '21 at 14:27
  • For now I chose to stay/stuck with 11.5.0 version without update - it's because I don't see any better solution for now. Maybe something change so what I can recommend is simply checking form time to time if something changed :/ – CodeJoe Aug 12 '21 at 13:01
  • @CodeJoe - Your solution worked for me. Thanks for the explonantion. – Terance Wijesuriya Nov 25 '21 at 04:38
1

I could solve it.

SOLVED

Just check in the file "package.json" that packages of firebase has the same version, example:

dependencies{
   "@react-native-firebase/admob": "^11.5.0",
   "@react-native-firebase/app": "^11.5.0"
}

TIP

Works to similars errors.

Mauro Elias
  • 99
  • 1
  • 7
  • Do you use react native > `0.64` ? I've tried your solution with `0.64.2`, but it's not working. – sj_959 Jul 31 '21 at 08:41
  • @Mauroelias I'm running on the same issue, seems just to broken to be true – Federico Baù Aug 08 '21 at 14:32
  • 1
    Just check that all versions of firebase are the same. It has to be 11.5 (I know it is an old version... but it is the only way that I found to use admob in react-native) – Mauro Elias Aug 09 '21 at 17:58
1

I am able to use 11.5.0 downgrade trick in react native 0.65.1 for my RewardedAds. I edited the package.json file as said. It didn't work but I managed to run it in a different way:

  1. Close any running react-native related terminals. Uninstall @react-native-firebase/app.

    npm uninstall @react-native-firebase/app

  2. Install the @react-native-firebase/app version 11.5.0 directly with this command.

    npm install @react-native-firebase/app@11.5.0

  3. After the installation, go to package.json>dependencies and do both packages versions the same(11.5.0) and remove ^.

    "@react-native-firebase/admob": "11.5.0",

    "@react-native-firebase/app": "11.5.0",

  4. Start the react-native with fresh cache then run-android.

    npx react-native start --reset-cache

    npx react-native run-android

CodeChanger
  • 7,953
  • 5
  • 49
  • 80
EkremAy
  • 139
  • 6