Tried accessing the GoogleMaps plugin but Cordova is not available

Ionic Native
1

I started a new blank project:

ionic start gmaps blank

then installed google-maps plugin:

ionic cordova plugin add GitHub - mapsplugin/cordova-plugin-googlemaps: Google Maps plugin for Cordova --variable API_KEY_FOR_ANDROID=“my-google-api-key”

along with:

npm install --save @ionic-native/google-maps

And imported GoogleMaps in app.module.ts and included it in providers.

After that, I added the example code provided by the plugin, to the home page and then served the blank project:

ionic serve

When the page loads in the browser though, no map is shown and I get the following javascript error:

util.js:63 Native: tried accessing the GoogleMaps plugin but Cordova is not available. Make sure to include cordova.js or run in a device/simulator

The content of home.html:

<ion-header>
  <ion-navbar>
    <ion-title>
      Ionic Blank
    </ion-title>
  </ion-navbar>
</ion-header>

<ion-content padding>
  The world is your oyster.
  <p>
    If you get lost, the <a href="http://ionicframework.com/docs/v2">docs</a> will be your guide.
  </p>
  <div id="map"></div>
</ion-content>

The content of home.scss:

page-home {
    #map {
        height: 100%;
    }
}

Chromes console error:

cordova-error

The output of running ionic info command:

cli packages: (/usr/local/lib/node_modules)

@ionic/cli-utils  : 1.10.2
ionic (Ionic CLI) : 3.10.3

global packages:

Cordova CLI : 7.0.1

local packages:

@ionic/app-scripts : 2.1.4
Cordova Platforms  : none
Ionic Framework    : ionic-angular 3.6.1

System:

Android SDK Tools : 26.0.1
Node              : v8.2.1
npm               : 5.3.0 
OS                : Linux 3.13

How can I fix this? Is there something I am doing wrong? I also tried to run this directly on my mobile device by running ionic cordova run android but the application crashed and exited. If I comment the following line from my code:

// this.loadMap();

and do not load the map, the application starts successfully on my phone and does not crash. Also after commenting the above line, the “tried accessing the GoogleMaps plugin but Cordova is not available.” error disappears as well.

1 Like
2

Try running your application on your device by typing the following in terminal:
ionic cordova run android -c
You’ll be able to see the console logs.
Mention those here to be clear.

3

@KapilSharma I don’t know why and how but the problem is solved and I can run the app successfully on my phone. Thank you :slight_smile:

4

Mention not @meysammahfouzi. Goot d to know that your issue is solved. :smiley:

5

How can i be able to run in a browser using ionic serve?