Question

我对Angular很新，并使用传单插件构建了我的第一个角度应用程序。所有这些都按预期工作，直到使用生产构建：

ng s --target=production 要么 ng build --target=production

传单地图容器不显示所有地图图块和/或错误的行，列。我试图用map.invalidateSize（）强制重绘地图;在onMapReady（..）但没有成功。

(leafletMapReady)="onMapReady($event)

根据* ngIf条件显示组件本身：

<div>
    <app-tracking-map *ngIf="deliveryState == 1" [trackingData]="trackingData"></app-tracking-map>
</div>

我实际上不知道从哪里开始调查只是猜测它与webpack和魔术捆绑的东西有关。

在angular-cli.json中我添加了传单css

      "styles": [
    "styles.css",
    "../node_modules/leaflet/dist/leaflet.css"
  ],

Answer 1

您可能遗漏了./node_modules/leaflet/dist/leaflet.css中的leaflet.css文件。如果缺少那个，则绘制地图和图块，但它们没有正确布局。

如何在Webpack构建中引用该文件取决于您如何设置项目。 ngx-leaflet README文件描述了一些最常见的配置：