ESRI Leaflet + Types + Angular 4

Hello,

I’m trying to get esri-leaflet and leaflet to work with typescript typings. I have installed the types into my package.json, and successfully imported them (with no errors) in vscode.

However, when running the application and defining a basemap layer, I get the error: ERROR TypeError: Cannot read property 'basemapLayer' of undefined I found out that the application does not bind esri to the leaflet module (L.esri is undefined).

Am I doing something wrong?

• Browser and version:

Chrome 59

• Version of Leaflet (L.version):

1.2.0

• Version of esri Leaflet (L.esri.VERSION):

2.2.1

Steps to reproduce the error:

1. Add leaflet, esri-leaflet, @types/leaflet, @types/esri-leaflet to package.json
2. Import the files within my application: import * as L from 'leaflet' import 'esri-leaflet'
3. Try to use esri-leaflet as basemap: basemap = L.esri.basemapLayer('oceans')

I then get the error described above: ERROR TypeError: Cannot read property 'basemapLayer' of undefined

I have searched throughout the issues, and found a similar issue, but I had no success in solving it.

I’m not using the CDN, I’m loading/bundling the library using:

webpack

Thanks for the help! Regards, Tiago

[calegarifabio]

const esri = require(‘esri-leaflet’); works for me!

[tgmendes]

@HarelM Thanks a lot! This worked for me.

1. Removed ESRI typings from package.json and node_modules
2. Used the import you mentioned: `import * as esri from ‘esri-leaflet’;
3. Used esri directly (i.e. not as an extension of Leaflet).
4. Still could use leaflet typings without a problem.

However, I still consider this to be a workaround, since it’s still not possible to use esri-leaflet’s typings.