Question

我正在尝试使用“ angular-map” npm软件包在angular 6中实现bingmap，因为我也有refer和referred 问题陈述：未在node_modules中创建“ bingmaps”文件夹

app.module.ts

/// <reference path="node_modules/bingmaps/types/MicrosoftMaps/Microsoft.Maps.All.d.ts" />
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { MapModule, MapAPILoader, BingMapAPILoaderConfig, BingMapAPILoader, WindowRef, DocumentRef, MapServiceFactory, BingMapServiceFactory } from "angular-maps";
import { AppComponent } from './app.component';

错误：

./ node_modules / angular-maps / fesm5 / angular-maps.js中的错误找不到模块：错误：无法解析“ D：\ bingmap \ bingmap \ node_modules \ angular-maps \ fesm5”中的“ bingmaps” 我｢wdm｣：编译失败。 src / app / app.module.ts（1,23）中的错误：错误TS6053：文件'D：/bingmap/bingmap/src/app/node_modules/bingmaps/types/MicrosoftMaps/Microsoft.Maps.All.d.ts ' 找不到。

还安装了npm install --save @types/bingmaps

Answer 1

我刚刚在本地和stackblitz上进行了测试，并且意识到必须安装一些库依赖项才能使角度图起作用。我收到了与您相同的错误，但是一旦安装了库，该错误就消失了。

您的package.json应该包含以下库：

"@types/bingmaps": "0.0.1",
"angular-maps": "^6.0.1",
"async": "^2.5.0",
"bingmaps": "^2.0.3",
"core-js": "^2.5.4",
"font-awesome": "^4.6.3",
"json-loader": "^0.5.7",

所以您需要安装它们

npm install --save angular-maps
npm install --save bingmaps
npm install --save @types/bingmaps
npm install --save async@2.5.0
npm install --save json-loader

我将font-awesome作为外部链接包含在index.html中：

<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.6.3/css/font-awesome.min.css" rel="stylesheet" />

在app.module.ts上以及在app.component.ts上：

import {
    MapModule,
    MapAPILoader,
    MarkerTypeId,
    IMapOptions,
    IBox,
    IMarkerIconInfo,
    WindowRef,
    DocumentRef,
    MapServiceFactory,
    BingMapAPILoaderConfig,
    BingMapAPILoader,
    GoogleMapAPILoader,
    GoogleMapAPILoaderConfig
} from 'angular-maps';

如果您还检查stackblitz，则可以看到依赖项上使用了哪些额外的库

使用angular-map包在Angular 6中整合Bingmap

1 个答案: