web-dev-qa-db-fra.com

Code Visual Studio: node_modules/@types/googlemaps/index.d.ts 'n'est pas un module

J'ai suivi ce didacticiel: Intégration de Google Maps dans Angular 5 pour démarrer avec Google Maps dans mon application Angular 5 à l'aide de Visual Studio Code (version 1.24.1 sur Mac). Jusqu'à tout récemment, tout fonctionnait bien, mais depuis quelques jours (je suppose qu'une mise à jour de VS Code a eu lieu à l'arrière-plan), une erreur s'est produite lors de l'importation de Google Maps dans Visual Studio Code qui ne m'avait jamais signalé d'erreur auparavant:

import { } from '@types/googlemaps';

Je reçois l'erreur suivante:

File 'full_path/node_modules/@types/googlemaps/index.d.ts' is not a module.

(note: full_path est le chemin complet du parent, qui ne s'affiche pas ici par souci de brièveté)

Je peux voir la bibliothèque située à l'emplacement correct dans mon répertoire node_modules. De plus, la bibliothèque est correctement référencée dans mon package.json (sa version 3.30.10). Je n'ai pas exécuté npm update ni aucune autre mise à jour entre le moment où cela fonctionnait et le moment où il a commencé à donner l'erreur.

Lorsque j'exécute "npm start" ou "npm run build", cela fonctionne très bien et l'application est servie comme auparavant (et Google Map restitue parfaitement), ce qui semble être un problème de code Visual Studio.

En ce sens, cela ne me bloque pas vraiment, mais ce serait bien d’obtenir l’erreur de mon IDE. Quelqu'un at-il des indications sur la façon de se débarrasser de l'erreur? Merci!

EDIT Je lis ici: Comment installer les typages TS pour Google Maps qu'il existe deux solutions possibles. Une directive triple barre oblique ou une modification de votre tsconfig.json. Pour moi, seule la directive triple barre fonctionnait:

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

Serait toujours intéressé par un correctif réel où je peux simplement importer les types de Google Maps.

angulartypescriptvisual-studio-code
6
Jonck van der Kogel

Utilisez uniquement la ligne située en haut de votre fichier .component.ts. Elle fonctionne pour moi.

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

MY tsconfig.json 

{
  "compileOnSave": false,
  "compilerOptions": {
    "baseUrl": "./",
    "outDir": "./dist/out-tsc",
    "sourceMap": true,
    "declaration": false,
    "moduleResolution": "node",
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "target": "es5",
    "typeRoots": [
      "node_modules/@types"
    ],
    "lib": [
      "es2017",
      "dom"
    ]
  }
}

Version MY @ types/googlemaps - "@types/googlemaps": "^3.30.11",

Ma version @ angular/core - "@angular/core": "^6.1.0",

ne pas utiliser les lignes ci-dessous (certaines réponses recommandent l’une ou l’autre) Plus tôt quand j’utilisais angular 6.0.0, cela fonctionnait, mais lors de la mise à niveau, cela ne fonctionnait pas: - 

import { } from 'googlemaps'; 
import { } from '@types/googlemaps';
1
Kewin Fernando