After installing leaflet typescript, I encountered issues when trying to use leaflet non-typescript plugins.
For instance, I had no problem importing the leaflet-routing-machine plugin by following these steps:
installation:
npm install --save leaflet-routing-machine
npm install --save @types/leaflet-routing-machine
angular component:
import 'leaflet-routing-machine';
import { Routing } from 'leaflet';
By doing this, I was able to successfully utilize the leaflet-routing-machine plugin with leaflet.
However, when attempting to use the AnimatedMarker plugin, which does not have typescript support, I struggled to make it work.
I experimented with different approaches, but none of them were successful:
import 'leaflet.animatedmarker/src/AnimatedMarker';
import { AnimatedMarker, animatedMarker } from 'leaflet';
// Compilation will fail
or
let AnimatedMarker = require('leaflet.animatedmarker/src/AnimatedMarker');
console.log(AnimatedMarker);
or
import * as AnimatedMarker from 'leaflet.animatedmarker/src/AnimatedMarker';
console.log(AnimatedMarker);
Despite the potential solution of using import * as L from 'leaflet'
L.AnimatedMarker
as discussed here, I preferred to find a different way to handle non-typescript plugins.