I'm pretty new to Angular and built my first angular app with leaflet plugin. All is working as expected until using production build:
ng s --target=production
or
ng build --target=production
The leaflet map container shows not all map-tiles and/or in wrong row, column. I tried to force the map redraw with map.invalidateSize(); in onMapReady(..) but with no success.
(leafletMapReady)="onMapReady($event)
the component itself is showed depending on *ngIf condition:
<div>
<app-tracking-map *ngIf="deliveryState == 1" [trackingData]="trackingData"></app-tracking-map>
</div>
I actually have no clue where to start the investigation just guess it's related to webpack and the magic bundling stuff.
in angular-cli.json I have added the leaflet css
"styles": [
"styles.css",
"../node_modules/leaflet/dist/leaflet.css"
],