Been wanting to get my feet wet with Typescript to start working on custom widgets and learning some React. So I've followed the example here, which worked like a charm.
The Typescript code includes the new kind of imports, which I imagine any Pythonista will prefer of the traditional require syntax in Javascript.
import Map = require("esri/Map");
import MapView = require("esri/views/MapView");
But I really wanted to get it to work like this, which would look even more like Python:
import Map from "esri/Map";
import MapView from "esri/views/MapView";
When I try that, the code still compiles successfully. But I get these intellisense warnings about default exports...
Since I'm new to Typescript, I will have to read up on this import/export business. In the meantime, is this an innocuous warning?
Based on this thread, I should be trying the following:
import * as Map from "esri/Map";
import * as MapView from "esri/views/MapView";
But that blows up completely...
app/main.ts:10:13 - error TS2351: Cannot use 'new' with an expression whose type lacks a call or construct signature.
10 const map = new Map({
~~~~~~~~~
11 basemap: "streets"
~~~~~~~~~~~~~~~~~~~~
12 });
~~
app/main.ts:7:1
7 import * as Map from "esri/Map";
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Type originates at this import. A namespace-style import cannot be called or constructed, and will cause a failure at runtime. Consider using a default import or import require here instead.
This source suggests this setting in tsconfig.json
"allowSyntheticDefaultImports": true
When I try that, Dev Tools scream at me:
Another tweak I tried came from here and looked like this:
"maintainModuleNames" : true.
But that didn't compile so well...
tsconfig.json:13:7 - error TS5023: Unknown compiler option 'maintainModuleNames'.
Long story short, if anything here screams rookie mistake, please comment. Would love to get these beautiful imports to work.