Visual Studio代码:node_modules/@types/googlemaps/index.d.ts'不是模块

Question

我遵循了本教程: 使用Visual Studio Code(Mac上的版本1.24.1)在Angular 5中集成Google Maps以开始使用我的Angular 5应用程序中的Google Maps.直到最近一切都工作正常,但几天前(我的猜测是VS代码的更新发生在后台)我在Visual Studio代码中导入谷歌地图时出错,以前从未给我错误:

import { } from '@types/googlemaps';

我收到以下错误:

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

(注意full_path是完整的父路径,为简洁起见,此处未显示)

我可以看到该库位于node_modules目录中的正确位置.此外,我的package.json中正确引用了库(它的版本为3.30.10).我没有运行npm update或其间的任何其他更新,当它工作时和它开始给出错误时.

当我运行"npm start"或"npm run build"时,它运行得很好,应用程序就像之前一样(并且Google Map渲染完美),因此它似乎是Visual Studio Code问题.

从这个意义上来说,它并没有真正阻止我,但是从我的IDE中获取错误会很好.有没有人有任何关于如何摆脱错误的指针？谢谢!

编辑 我在这里阅读:如何为谷歌地图安装TS类型,有两种可能的解决方案.三重斜杠指令或改变你的tsconfig.json.对我来说,只有三斜杠指令有效:

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

仍然会对我可以导入Google地图类型的真正修复感兴趣.

Answer 1

仅使用 .component.ts 文件顶部的以下行，它对我有用。

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

我的 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"
    ]
  }
}

我的@types/googlemaps 版本 -"@types/googlemaps": "^3.30.11",

我的@angular/core 版本 -"@angular/core": "^6.1.0",

不要使用下面的行（一些答案推荐其中之一）早些时候，当我使用 Angular 6.0.0 时，它可以使用这些行，但当我升级时，它没有：-

import { } from 'googlemaps'; 
import { } from '@types/googlemaps';