Typescript Error Cannot find name "google" in ionic2 when using javascript googlemaps API

Question

I follow Joshua Moroni. Getting started with Google Maps in the Ionic 2 video. I want to use Google maps in my application and I get a typescript error. this is part of the page /home/home.ts

initMap(){
let latLng= new google.maps.LatLng(6.929848, 79.857407);

let mapOpt={
  center : latLng,
  zoom : 15,
  mapTypeId :google.maps.MapTypeId.ROADMAP
};

this.map= new google.maps.Map(this.mapElement.nativeElement,mapOpt);}

I tried npm install --save @types/googlemaps,

but it still gives me the same typescript error Typescript Error Cannot find the name "google"

Answer 1

I solved this by setting:

$npm install @types/googlemaps --save-dev

Answer 2

To extend the answer from @suraj you should have:

declare var google; 

, .

Josh Morony, , (@Injectable() ..). , , ( ), - .

Answer 3

npm install --save-dev @types/googlemaps

import {} from '@types/googlemaps';

component.ts

declare var google; export class component {}

Angular 6+, :

( 1, ) Typescript:

///<reference types="@types/googlemaps"/>

import {RemainingItems} from 'whicheverfolderyouwant';

Answer 4

:

npm install --save-dev @types/googlemaps

And in your typescript file where you use the "google" namespace:

[Corner 6+] Add this line at the beginning:

/// <reference types="@types/googlemaps" />

[Corner 5-] Add this line:

import {} from '@types/googlemaps';

from this answer

Answer 5

No need to do anything. Just go to index.d.ts and paste this in before the google.maps namespace declaration

declare module 'googlemaps';