How can we get the Syntax Tree of TypeScript? How can we get the Syntax Tree of TypeScript? typescript typescript

How can we get the Syntax Tree of TypeScript?


The TypeScript compiler API is really quite easy to use. To parse a typescript file and obtain the AST, try the following:

const ts = require('typescript');const sourceFile = ts.createSourceFile(filename,    fs.readFileSync(filename).toString(), ts.ScriptTarget.ES6, false);console.log(sourceFile.ast);

This generates the AST, for example:

{  "kind": 251,  "pos": 0,  "end": 1097,  "flags": 0,  "bindDiagnostics": [],  "languageVersion": 2,  "fileName": "slidingWindow.ts",  "languageVariant": 0,  "scriptKind": 3,  "referencedFiles": [],  "amdDependencies": [],  "statements": [    {      "kind": 218,      "pos": 0,      "end": 69,      "flags": 0,      "name": {        "kind": 69,        "pos": 10,        "end": 22,        "flags": 0,        "text": "Accumulator",        "kindDecoded": "Identifier"      },      "members": [        {          "kind": 148,          "pos": 24,          "end": 67,          "flags": 0,          "parameters": [            {              "kind": 139,              "pos": 28,              "end": 42,              "flags": 0,              "name": {                "kind": 69,                "pos": 28,                "end": 32,                "flags": 0,                "text": "data",                "kindDecoded": "Identifier"              },              "type": {                "kind": 157,                "pos": 33,                "end": 42,                "flags": 0,                "elementType": {                  "kind": 128,                  "pos": 33,                  "end": 40,                  "flags": 0,                  "kindDecoded": "NumberKeyword"                },                "kindDecoded": "ArrayType"              },              "kindDecoded": "Parameter"            },            {              "kind": 139,              "pos": 43,              "end": 57,              "flags": 0,              "name": {                "kind": 69,                "pos": 43,                "end": 49,                "flags": 0,                "text": "index",                "kindDecoded": "Identifier"              },              "type": {                "kind": 128,                "pos": 50,                "end": 57,                "flags": 0,                "kindDecoded": "NumberKeyword"              },              "kindDecoded": "Parameter"            }          ],          "type": {            "kind": 128,            "pos": 59,            "end": 66,            "flags": 0,            "kindDecoded": "NumberKeyword"          },          "kindDecoded": "CallSignature"        }      ],      "kindDecoded": "InterfaceDeclaration"    },...


Do you need to get the AST from a specific compiler or just get the syntax tree from a program in TypeScript? If you are interested in the later, then what you may need to do is grab a BNF grammar for TypeScript (starting point here) and then use ANTLR for example. It has a tool named ANTLRWorks that allows you to visualise the syntax tree of a program.