在.Net Core2.0角2 SPA模板中加载时髦信息窗口模块的错误

Question

我试图安装以下插件到我的.Net核心SPA；

角谷歌地图时髦的窗口链接

我运行了以下步骤；

将以下内容添加到我的package.json中；

"agm-core": "1.0.0-beta.5",
"agm-snazzy-info-window": "1.0.0-beta.5",

然后右击Visual和更新的包。

然后，我将模块添加到我的app.shared.module.ts中；

import { AgmCoreModule } from 'agm-core';
import { AgmSnazzyInfoWindowModule } from 'agm-snazzy-info-window';

AgmCoreModule.forRoot({
    apiKey: 'my-api-key'
}),
AgmSnazzyInfoWindowModule

此后，我还将以下内容添加到我的webpack.config.vendor.js中；

const nonTreeShakableModules = [
    ...
    'agm-snazzy-info-window'
];

我的组件中的html代码是；

        <agm-map [latitude]="lat" [longitude]="lng" [zoom]="zoom">
            <agm-marker [latitude]="lat" [longitude]="lng">
                <agm-snazzy-info-window [maxWidth]="200" [closeWhenOthersOpen]="false">
                    <ng-template>
                        My first Snazzy Info Window!
                    </ng-template>
                </agm-snazzy-info-window>
            </agm-marker>
        </agm-map>

但是，当我运行时，我会得到以下错误；

找不到./node_modules/agm-snazzy-info-window/directives/snazzy-info-window.js模块中的错误：'C:\Users\matt\Source\Repos\MyProject\node_modules\agm-snazzy-info-window\directives‘@ ./node_modules/agm-snazzy-info-window/directives/snazzy-info-window.js 88:39-74 @node_modules/agm-snazzy中的错误:无法解析’snazzy-info-窗口‘-info-window/index.js @ ./ClientApp/app/app.shared.module.ts @ ./ClientApp/app/app.browser.module.ts @ ./ClientApp/boot.browser.ts @多个事件-源- webpack-hot-middleware/client?path=__webpack_hmr&dynamicPublicPath=true ./ClientApp/boot.browser.ts

现在，如果我删除时髦的信息窗口和仅仅显示谷歌地图，它工作的好吗？请问我在这里做错了什么？

Answer 1

此错误很可能发生在缺少snazzy-info-window包(表示agm-snazzy-info-window的依赖项)之后，因此也需要安装它，例如：

"@agm/core": "1.0.0-beta.2",
"@agm/snazzy-info-window": "1.0.0-beta.2",
"snazzy-info-window": "^1.1.0"

此外，还需要包括一些随snazzy-info-window npm包提供的基本样式，例如：

const nonTreeShakableModules = [
    'snazzy-info-window',
    'snazzy-info-window/dist/snazzy-info-window.css'
];