refactor: enable typescript option erasableSyntaxOnly

src/Context.ts

@@ -664,10 +664,10 @@ export class Context {
       this._context.setLineDash(segments);
     } else if ('mozDash' in this._context) {
       // verified that this works in firefox
-      (<any>this._context['mozDash']) = segments;
+      (this._context as any)['mozDash'] = segments;
     } else if ('webkitLineDash' in this._context) {
       // does not currently work for Safari
-      (<any>this._context['webkitLineDash']) = segments;
+      (this._context as any)['webkitLineDash'] = segments;
     }
 
     // no support for IE9 and IE10

src/Node.ts

@@ -1911,7 +1911,7 @@ export abstract class Node<Config extends NodeConfig = NodeConfig> {
       attrs[key] = obj[key];
     }
 
-    const node = new (<any>this.constructor)(attrs);
+    const node = new (this.constructor as any)(attrs);
     // copy over listeners
     for (key in this.eventListeners) {
       allListeners = this.eventListeners[key];

src/Util.ts

@@ -529,7 +529,7 @@ export const Util = {
     const canvas = document.createElement('canvas');
     // on some environments canvas.style is readonly
     try {
-      (<any>canvas).style = canvas.style || {};
+      (canvas as any).style = canvas.style || {};
     } catch (e) {}
     return canvas;
   },
@@ -991,7 +991,7 @@ export const Util = {
   // very simplified version of Object.assign
   _assign<T, U>(target: T, source: U) {
     for (const key in source) {
-      (<any>target)[key] = source[key];
+      (target as any)[key] = source[key];
     }
     return target as T & U;
   },

src/types.ts

@@ -51,27 +51,27 @@ export interface IFrame {
 
 export type AnimationFn = (frame: IFrame) => boolean | void;
 
-export enum KonvaNodeEvent {
+export const KonvaNodeEvent = {
-  mouseover = 'mouseover',
+  mouseover: 'mouseover',
-  mouseout = 'mouseout',
+  mouseout: 'mouseout',
-  mousemove = 'mousemove',
+  mousemove: 'mousemove',
-  mouseleave = 'mouseleave',
+  mouseleave: 'mouseleave',
-  mouseenter = 'mouseenter',
+  mouseenter: 'mouseenter',
-  mousedown = 'mousedown',
+  mousedown: 'mousedown',
-  mouseup = 'mouseup',
+  mouseup: 'mouseup',
-  wheel = 'wheel',
+  wheel: 'wheel',
-  contextmenu = 'contextmenu',
+  contextmenu: 'contextmenu',
-  click = 'click',
+  click: 'click',
-  dblclick = 'dblclick',
+  dblclick: 'dblclick',
-  touchstart = 'touchstart',
+  touchstart: 'touchstart',
-  touchmove = 'touchmove',
+  touchmove: 'touchmove',
-  touchend = 'touchend',
+  touchend: 'touchend',
-  tap = 'tap',
+  tap: 'tap',
-  dbltap = 'dbltap',
+  dbltap: 'dbltap',
-  dragstart = 'dragstart',
+  dragstart: 'dragstart',
-  dragmove = 'dragmove',
+  dragmove: 'dragmove',
-  dragend = 'dragend',
+  dragend: 'dragend',
-}
+} as const;
 
 export interface RGB {
   r: number;

tsconfig.json

@@ -7,8 +7,8 @@
     "noUncheckedSideEffectImports": true,
     "rewriteRelativeImportExtensions": true,
     "isolatedModules": true,
+    "erasableSyntaxOnly": true,
     // ideally we want to enable erasableSyntaxOnly & verbatimModuleSyntax for true node interop
-    "erasableSyntaxOnly": false,
     "verbatimModuleSyntax": false,
     // "sourceMap": true,
     "noEmitOnError": true,