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

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.

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" />

29

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