How can I transform a custom AST into JS code
Asked Answered
C

2

14

I am currently generating a custom AST from a new language specification I have designed. This custom AST contains different nodes that I have designed with all the information I need in order to now generate JavaScript code. For example:

Say I have a customExpressionNode which I wish to translate into a JavaScript function which contains a couple of if conditions.

I am currently looking into libraries like Babylon and Esprima for generating a new Javascript AST from my Custom AST, but from what I've seen there is quite a lot of complexity in the AST that these libraries use. I would also like to avoid printing js code into a few files and then parsing and compiling them, so my question is:

Is there a better way of generating programmatically a JavaScript compliant AST that I can use to generate JavaScript code?

Cymbre answered 3/4, 2018 at 12:4 Comment(5)
I don't understand your question. Your title asks for generating JS code from the AST you have, which should be simple with the respective Babel method. The body of your post asks about generating the AST, but your first sentence states that you already can do that with your own parser from files in your own language?Malatya
Thanks for the feedback @Malatya . I have edited the question, hope it's clear now.Cymbre
So you have an AST from your custom language that is not quite in the format that babel (etc) use for JS ASTs, and you wonder whether the best way is to a) translate it to a "unnecessarily complex" babel AST and use the babel serializer or b) just serialize into JS code directly?Malatya
Yes, that is exactly what I would like to find out! @Malatya What I mean by unnecessarily complex is that it seems to contain a lot of extra information that I may not need for this specific case, however I am aware that those ASTs are complex for good reasons.Cymbre
I always found the format quite straightforward. Sure, if the output comes from parsing a JS file there's lots of debugging stuff in it like line numbers that can be used to generate source maps, but you shouldn't need all of that when you are generating it yourself. I'd guess many of the properties are optional, just try to leave them out. If you want to use some common babel transformations on the JS AST (like convert to ES5), then I'd still recommend to go this route, otherwise just try whether you can do it simpler yourself.Malatya
N
7

Something like this? https://github.com/estools/escodegen

A simple example: the program

escodegen.generate({
    type: 'BinaryExpression',
    operator: '+',
    left: { type: 'Literal', value: 40 },
    right: { type: 'Literal', value: 2 }
})

produces the string '40 + 2'.

Nicollenicolson answered 25/4, 2018 at 23:25 Comment(3)
But how do you get the AST in the first place from Javascript? Put another way, I see libraries for parsing Javascript to AST, each with different syntaxes, but how do I turn them back into javascript after I have done whatever manipulations are necessary?Abort
@Abort Use escodegen for AST -> Code and acorn for Code -> AST; do your manipulations while it's an ASTOstracoderm
github.com/acornjs/acornOstracoderm
S
4

install @babel/generator

npm install --save-dev @babel/generator
const { default: generate } = require("@babel/generator");

Identifier(path) {
  console.log(generate(path.node).code); // code string
},


Sedillo answered 7/2, 2020 at 8:48 Comment(0)

© 2022 - 2024 — McMap. All rights reserved.