Esri / angular-cli-esri-map

Example Angular component for building mapping applications with the ArcGIS API for JavaScript
https://stackblitz.com/edit/angular-cli-esri-map3
Apache License 2.0
89 stars 48 forks source link

Imports could be better #46

Closed ekrapfl closed 4 years ago

ekrapfl commented 4 years ago

I am looking into using the arcgis-angular-webpack branch as an example for how to implement nice module loading for the ArcGIS JS API in our Angular application. I have used the branch as an example, and it seems to work pretty well. One thing of note, however, is that when you import modules the way the example shows:

import Map from "arcgis-js-api/Map";
import MapView from "arcgis-js-api/views/MapView";

They are imported as any This is pretty problematic to use, and in a lot of cases, people like to use the noImplicitAny compiler flag. This workflow will not allow you to do that.

In my experimentation, I was able to structure the imports as such:

import * as Map from "esri/Map";
import * as MapView from "esri/views/MapView";

This is using the module names as defined in the typings, and by doing so, the imported modules come in with the correct typings. It seems much nicer this way, and everything seems to continue functioning.

My question is: Is what I am doing a bad practice in some way? If not, could the example be updated to import in this way?

Thanks, Eben

andygup commented 4 years ago

Hey @ekrapfl, your approach is good, there is no incorrect answer as related to noImplicitAny. You do raise a good point and I can definitely update the code and make the typings implementation cleaner if someone does set that flag. Here's a quote from the Angular docs https://angular.io/guide/typescript-configuration:

* TypeScript developers disagree about whether the noImplicitAny flag should be true or false. There is no [in]correct answer and you can change the flag later. But your choice now can make a difference in larger projects, so it merits discussion.

Also note, you can set "esModuleInterop": true in tsconfig.json and then you should be able to use this pattern with "noImplicitAny": true:

import Map from "esri/Map";

I'll make some updates.

ekrapfl commented 4 years ago

Thanks for the feedback @andygup! Just wanted to make sure I wasn't doing anything wrong :)

andygup commented 4 years ago

Done via https://github.com/Esri/angular-cli-esri-map/commit/6efa23eba493ce9bfdf4be5e1becf550cb38886c