ERROR in node_modules/@types/googlemaps/index.d.ts -- A tuple type element list cannot be empty

Question

while trying to integrate the angular google maps - agm librarie in my angular project i got this error :

somthing is worng with some configuration or maybe something i have missed i m working with material 6 and angular 6 in this project thanks for your help

in terminal console

ERROR in node_modules/@types/googlemaps/index.d.ts(63,25): error TS1122: A tuple type element list cannot be empty.
node_modules/@types/googlemaps/index.d.ts(72,25): error TS1122: A tuple type element list cannot be empty.
node_modules/@types/googlemaps/index.d.ts(94,15): error TS1122: A tuple type element list cannot be empty.
node_modules/@types/googlemaps/index.d.ts(100,18): error TS1122: A tuple type element list cannot be empty.
node_modules/@types/googlemaps/index.d.ts(106,20): error TS1122: A tuple type element list cannot be empty.
node_modules/@types/googlemaps/index.d.ts(115,26): error TS1122: A tuple type element list cannot be empty.
node_modules/@types/googlemaps/index.d.ts(121,15): error TS1122: A tuple type element list cannot be empty.
node_modules/@types/googlemaps/index.d.ts(130,28): error TS1122: A tuple type element list cannot be empty.
node_modules/@types/googlemaps/index.d.ts(155,29): error TS1122: A tuple type element list cannot be empty.
node_modules/@types/googlemaps/index.d.ts(167,22): error TS1122: A tuple type element list cannot be empty.
node_modules/@types/googlemaps/index.d.ts(176,23): error TS1122: A tuple type element list cannot be empty.
node_modules/@types/googlemaps/index.d.ts(185,23): error TS1122: A tuple type element list cannot be empty.
node_modules/@types/googlemaps/index.d.ts(3308,76): error TS2370: A rest parameter must be of an array type.

here is what i did :

npm i @agm/core 
npm i -D @types/googlemaps 
ng add @angular-material-extensions/google-maps-autocomplete

app.module.ts

import { AgmCoreModule } from '@agm/core';
import { MatGoogleMapsAutocompleteModule } from '@angular-material-extensions/google-maps-autocomplete';

@NgModule({
  declarations: [AppComponent, ...],
  imports: [
     AgmCoreModule.forRoot({
          apiKey: 'YOUR_KEY',
          libraries: ['places']
        }),
     MatGoogleMapsAutocompleteModule.forRoot(), ...],  
  bootstrap: [AppComponent]
})
export class AppModule {
}

mycomponent.component.html

<mat-form-field>
  <mat-label>Address << using the directive >></mat-label>
  <input matInput
       matGoogleMapsAutocomplete
       [country]="de"
       (onAutocompleteSelected)="onAutocompleteSelected($event)"
       (onLocationSelected)="onLocationSelected($event)">
</mat-form-field>

mycomponent.component.ts

...
import {} from 'googlemaps';



@Component({
  selector : ...
...

src/index.d.ts

declare module 'googlemaps';

tsconfig.app.json

    ...
   "types": [
      "googlemaps"
    ]
   ...

package.json

 "dependencies": {
    "@agm/core": "^1.1.0",
    "@angular-material-extensions/google-maps-autocomplete": "^2.0.0",
    "@angular/animations": "^6.1.10",
    "@angular/cdk": "^6.1.0",
    "@angular/common": "^6.1.0",
    "@angular/compiler": "^6.1.0",
    "@angular/core": "^6.1.0",
    "@angular/forms": "^6.1.0",
    "@angular/material": "^6.1.0",
    "@angular/material-moment-adapter": "^8.2.3",
    "@angular/platform-browser": "^6.1.0",
    "@angular/platform-browser-dynamic": "^6.1.0",
    "@angular/router": "^6.1.0",
    "googleapis": "28.1.0",
    ...
    "@types/googlemaps": "^3.39.0",
    "rxjs": "^6.5.3",
    "rxjs-compat": "^6.5.3",
    "zone.js": "~0.8.26"
  },

followed tutorial : link to tuto used

Solution : i don't know why and how but rolling back to an older version worked for me !! but that's not the proper solution i looking for

Answer 1

You need to go back to a version that works.

In your package.json file, choose an older version specifically:

...    
"@types/googlemaps" :  "3.26.15"
...