extts

Runtime library creating ExtJS classes from compiled TypeScript modules with classes.

Also contains tools for generating compatible definition files.

Usage

 
import define, { extend } from 'extts'; // correct path to this module
 
// needed to override default TypeScript __extends function
// https://github.com/Microsoft/TypeScript/issues/1622
var __extends = extend;
 
export default define(class extends Ext.button.Button {
    // custom implementation of button inherited from Ext.button.Button
}); 
 

 
import Button from './button';
 
const b = new Button({
    text: 'OK'
});
 
b.render(document.body);
 

Main concepts

• ES6 modules are embraced (instead of Ext.Loader)
  • no Sencha CMD needed to produce release build
  • use browserify or webpack
• by default creates anonymous classes
  • no global polution (other than Ext itself)
  • can't use aliases (other than Ext built-ins)
• Restrictions
  • no alias includes xtype (Ext.widget)
  • avoid singleton classes (rather use pure TypeScript construct)
  • TypeScript constructor and Ext constructor are in conflict (because super() and callParent() differ)
    • define ctor method that will be used as Ext constructor

Open topics

• static function vs. var
  • Ext.EventObject
  • Ext.Loader

State of the art

• https://github.com/fabioparra/TypeScript
  • Compiling directly from TypeScript to ExtJS class system
• brian428/ext-typescript-generator
  • d.ts generator from jsduck metadata
• extjsTypescript
• http://stackoverflow.com/questions/24671996/typescript-definitions-for-extjs-5
• http://blorkfish.wordpress.com/2013/01/28/using-extjs-with-typescript/