Suggestion - Module Loader for non-UMD style usage of ESRI classes & objects

Built and use this in a production app on top of esri-loader to easily access parts of the API.

https://gist.github.com/davidpiesse/19060cf21f90f4a1460aa33954b4b957

Instead of always having to

esriLoader.loadModules(['esri/views/MapView', 'esri/WebMap'])
.then(([MapView, WebMap]) => {
  let web_map = new WebMap({ ... });
}
...

now you can

await esri.loadModules([
  'esri/Map', 
  'esri/views/MapView',
],true)

let map_view = new MapView({
  map: map,
  spatialReference: 102100
})

I use it a lot and usually wrap calls in promises etc. to know when a object is then ready.

It doesn’t re-download if something is already loaded in and auto assigns names to the classes (so esri/views/MapView is MapView) rather than the long winded UMD style method which means you need to keep them in order.

This is also makes it super easy to only request a module when you need it inline with your code

[andygup]

👍 here’s a working await implementation https://github.com/Esri/angular-cli-esri-map/blob/master/src/app/esri-map/esri-map.component.ts#L66

[davidpiesse]

Fair enough. I’ll close this then 😅 One of my main reasons for this method was I preferred opinionated code in this context and having to organise and remember the order of declarations was a pain.