TS2304: Cannot find name 'google'

Ionic Framework ionic-v3
21

Please have a look on this updated tutorial by josh morony

you might need to change ionViewLoaded to ionViewDidLoad for rc0/1

22

Thank you @toanuranjans. I finally succeeded to display the map. I followed the tutorial and it worked. I assume that placing the script tag of google maps before the cordova tag made my code works

1 Like
23

After upgrading from Ionic2 beta to RC3,

I ran:

npm install --save @types/google-maps

which added the following to my package.json:

"@types/google-maps": "^3.2.0",

My index.html has:

  <script src="http://maps.google.com/maps/api/js"></script>
  <script src="cordova.js"></script>

My code contains:

declare var google: any;
...
public map: google.maps.Map = null;

But I get the following error when I run ionic serve:

Cannot find namespace 'google'.

In my IDE (VSC), if I click on google, it takes me to node_modules\@types\googlemaps\index.d.ts which seems to have the correct definition.

Any ideas appreciated.

24

Here is how it needs to be done with the newer versions of Ionic 2.

1 Like
25

try this in index.html before referencing cordova.js

<script src="https://maps.google.com/maps/api/js?key=<YOUR_KEY>&libraries=places"></script>

26

declare var google,

27

I have found that the Ionic Native version of Google maps is limited, e.g. it does not have the fitBounds function as found in Googles api.

As a result, I am trying to rather just use the Google api. However, I cannot seem to resolve this error, since the upgrade from beta to rc3.

Cannot find namespace 'google'.

I have tried

declare var google: any

and I do have the script in my index.html

28

I solved this my adding the following to declarations.d.ts

/// <reference path="../node_modules/@types/googlemaps/index.d.ts" />

1 Like
29

Try adding google map api link referencing on top after css file reference and before corodva reference.