recast
JavaScript syntax tree transformer, nondestructive pretty-printer, and automatic source map generator (by benjamn)
astexplorer
A web tool to explore the ASTs generated by various parsers. (by fkling)
SurveyJS - Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App
With SurveyJS form UI libraries, you can build and style forms in a fully-integrated drag & drop form builder, render them in your JS app, and store form submission data in any backend, inc. PHP, ASP.NET Core, and Node.js.
surveyjs.io
featured
recast | astexplorer | |
---|---|---|
6 | 43 | |
4,825 | 5,953 | |
- | - | |
5.8 | 6.0 | |
29 days ago | 10 days ago | |
TypeScript | JavaScript | |
MIT License | MIT License |
The number of mentions indicates the total number of mentions that we've tracked plus the number of user suggested alternatives.
Stars - the number of stars that a project has on GitHub. Growth - month over month growth in stars.
Activity is a relative number indicating how actively a project is being developed. Recent commits have higher weight than older ones.
For example, an activity of 9.0 indicates that a project is amongst the top 10% of the most actively developed projects that we are tracking.
Stars - the number of stars that a project has on GitHub. Growth - month over month growth in stars.
Activity is a relative number indicating how actively a project is being developed. Recent commits have higher weight than older ones.
For example, an activity of 9.0 indicates that a project is amongst the top 10% of the most actively developed projects that we are tracking.
recast
Posts with mentions or reviews of recast.
We have used some of these posts to build our list of alternatives
and similar projects. The last one was on 2024-04-05.
-
What is an Abstract Syntax Tree in Programming?
GitHub | Website
-
[AskJS] Any good shortcuts for migrating off of enzyme?
If jscodeshift is confusing, I recommend looking into using recast directly, along with ast-types for AST traversal and its node factories. Inside your visitors, write some conditionals that check for the patterns you want to detect, then mutate the node passed to the visitor, or otherwise mutate the AST. Keep going until tests are passing.
-
Evan you on Svelte migration from Vue
I ended up writing my own codemod tool based on recast to automate most of the repetitive, mindless grunt work. Even with the tool shaving hundreds of hours off of the migration effort, there's still a huge amount of work left, since we need to find or create Vue 3-compatible alternatives of all of our Vue 2-only dependencies. Some of these dependencies (e.g. vee-validate) are used pretty ubiquitously too
-
Which library to use for AST manipulation?
I had great results with a combination of babel + recast. Babel is doing the job and Recast is mostly here to preserve the original style when printing code again. I animated a workshop @ Node.JS Montréal 2019 that was recorded here. We cover the parse/transform/print of code using Babel (live coding starts around 45').
-
JARVIS – Write me a Codemod
recast
- Show HN: Monocle – bidirectional code generation library
astexplorer
Posts with mentions or reviews of astexplorer.
We have used some of these posts to build our list of alternatives
and similar projects. The last one was on 2024-04-06.
-
Understanding Code Structure: A Beginner's Guide to Tree-sitter
You can play with your code here, and visualise ASTs for the same.
-
What is an Abstract Syntax Tree in Programming?
Website
-
How to create your own Eslint rule with tests, boosting the DX, and code-review
To understand this syntax, I recommend exploring AST Explorer. You will have a better view of how the AST of JavaScript works and how to correlate it with the Eslint syntaxy:
-
Programming from Top to Bottom - Parsing
You can never mistake type_declaration with an identifier, otherwise the program will not work. Aside from that constraint, you are free to name them whatever you like, there is no one standard, and each parser has it own naming conventions, unless you are planning to use something like LLVM. If you are interested, you can see examples of naming in different language parsers in the AST Explorer.
-
ESLint: under the hood
The rule that I want to write will be called not-allows-underscore: the idea is to abolish the use of underscores when declaring variables or functions. It's a real dummy rule, but it should be enough to see in action the concepts that we have discussed earlier. The first thing that I would do is to go to AST Explorer, write down a code that declares variables and functions (both standard and arrows one) and take a look at what type of node is the one that encodes the identifier. Doing that, I found out that the node type of my interest is Identifier, what a surprise! 🤣. In particular, the structure of the node holds the string used as identifier in the name property.
-
😱 ESlint over Conventions - You have Not unlocked the power of ESlint 😱
All the information about the API, AST node names, AST Explorer, etc. you can read in the official documentation. I’m just going to show examples of how to automate the check-up of our created conventions.
- AST Exploret
-
200 Web-Based, Must-Try Web Design and Development Tools
AST Viewer
-
Building a JSON Parser from scratch with JS 🤯
If you want to see how the AST of popular languages looks, I recommend the AST Explorer. It supports various languages, and you can view the complete AST and navigate through the nodes. If you want to go further, you can try to copy some logic from an existing parser and implement it in your own, such as calculating an expression according to precedence order, for example: 1 + 2 * 3 (which is 7, not 9).
-
Creating my own typescript compiler
https://astexplorer.net/ is a good resource/playground for understanding ASTs and transpilers.
What are some alternatives?
When comparing recast and astexplorer you can also consider the following projects:
escodegen - ECMAScript code generator
deno_swc - The SWC compiler for Deno.
espree - An Esprima-compatible JavaScript parser
gogocode - GoGoCode is a transformer for JavaScript/Typescript/HTML based on AST but providing a more intuitive API.
Acorn - A small, fast, JavaScript-based JavaScript parser
vscode-language-tree - VSCode tree format support
jscodeshift - A JavaScript codemod toolkit.
ChakraCore - ChakraCore is an open source Javascript engine with a C API.
ast-node-finder - AST Node Find api automatically generated from code
ts-lite - Compiled TypeScript. Generates Go, Swift, Kotlin, WASM, Binary
proposal-type-annotations - ECMAScript proposal for type syntax that is erased - Stage 1