Hans Bäuml
Hans Bäuml

Reputation: 229

Customize Typescript compiler output

I need some help getting started in customizing the compiler output of typescript, or to be more precise if it is even possible.

I have the openui5 framework, which syntax, for example extending classes, varies strongly from ES5+ standards. Also AMD works differently.

Here is an example:

I would like to import a module. In typescript it should be:

import { Button } from "sap/m/Button";

which puts out something like this in javascript:

var Button = require("sap/m/Button");

But what I need here is:

var Button = sap.ui.require("sap/m/Button");

Another example:

Properties are resolved with getter and setter functions. So when you extend a class you can give it a json object with properties:

properties: {
   "title" : "string",                         // a simple string property, default value is undefined
   "buttonText" : {defaultValue: "Search"},    // when no type is given, the type is string
   "showLogoutButton" : {type : "boolean", defaultValue : true},   // a boolean property where a default value is given
   "width" : {type : "sap.ui.core.CSSSize", defaultValue : "50px"} // a CSS size property where a default value is given
}

now openui5 will take the given property and generate the setters. For example for the "title" property the two functions will be generated:

getTitle();
setTitle(value);

But no ES 5 property.

So in typescript you cannot access your property like this:

let myclass = new MyClass(); myclass.title = "Hello World";

but you will have to use the getter and setter methods:

let myclass = new MyClass(); myclass.setTitle("Hello World");

What I would like to do here is to write this typescript code:

let myclass = new MyClass();
myclass.title = "Hello World";

which transpiles to this javascript code:

let myclass = new MyClass();
myclass.setTitle("Hello World");

I think I can do this on my classes using decorators, but you cannot use decorators in declaration files (d.ts). So I cannot use the base classes this way.

So here is my question:

Is it possible to extend the typescript transpiler and tell it to compile this stuff differently?

A push in the right direction would be much appreciated.

Upvotes: 1

Views: 750

Answers (1)

Misaz
Misaz

Reputation: 3985

You can make your own transpiler.

  1. by extending TypeScript source codes
  2. by script using TypeScript Language Service (docs TSLS) and Compiler API (docs Compiler API) you can process scripts and build own transpiler by simple way.
  3. write code as framework requires.

Upvotes: 2

Related Questions