4.x SDK and TypeScript

JordanBaumgardner — Fri, 10 Dec 2021 21:40:24 GMT

I've been enjoying TypeScript and have been using it more and more in our projects. I've had to look up how to add a TS class to my projects several times now so I thought I'd place it here.

There are two key things that I keep forgetting.

1) It must be compiled in the correct format:

  "compilerOptions": {
    "target": "es5",
    "module": "amd",
    "moduleResolution": "node"
  },
‍‍‍‍‍

and you must create your class correctly with the export on the last line.

import EsriView = require("esri/views/MapView");
class EventCreatorModule {
    public mapView:EsriView;
    constructor() {
    };
}
export = EventCreatorModule;
‍‍‍‍‍‍‍

Note: The following will NOT work

// THIS WILL FAIL
import EsriView = require("esri/views/MapView");
export class EventCreatorModule {
    public mapView:EsriView;
    constructor() {
    };
}
// THIS WILL FAIL‍‍‍‍‍‍‍‍

This is my boilerplate

\tsconfig.json

{
  "compilerOptions": {
    "target": "es5",
    "module": "amd",
    "moduleResolution": "node",
    "noImplicitAny": true,
    "removeComments": false,
    "preserveConstEnums": true,
    "sourceMap": true,
    "jsx": "react",
    "jsxFactory": "tsx",
    "experimentalDecorators": true,
    "suppressImplicitAnyIndexErrors": true
  },
  "include": [
    "Scripts/**/*"
  ],
  "exclude": [
  ]
}‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

[Empty Class]

class [MyClass] {
    constructor() {
    }
}
export = [MyClass];‍‍‍‍‍

topic 4.x SDK and TypeScript in ArcGIS JavaScript Maps SDK Questions

4.x SDK and TypeScript