如何使用acorn.js或类似的库将新节点添加到ast树中？

Question

我试图使用acorn.js和yeoman一起为现有的js文件添加代码。我曾尝试使用esprima和acorn来完成这项工作，但我找不到任何关于向AST添加节点的文档。

Answer 1

（晚了三年，但答案在这里）

您首先需要了解，并不是简单地向 AST 树的任何地方添加一个新节点。由于您表示要将代码添加到 js 文件，因此您需要将其添加到带有 body 的节点。操作 body 的方式与处理数组的方式相同（以 acorn 为例）。以下是如何向 FunctionDeclaration 节点添加节点的示例。

// astNode is a FunctionDeclaration node with a body that contains more nodes
// newNode is the code you want to insert
astNode.body.push(newNode); // add node at the end of the function block
astNode.body.unshift(newNode); // add node at the beginning of the function block
astNode.body.splice(index, 0, newNode); // add node at index

Answer 2

我发现有用的是将estraverse与橡子一起使用。您可以使用橡子将JS文件转换为AST，然后根据ECMAscript轻松地用estraverse添加或替换节点。

您需要查找的是estraverse.replace（..）API。

Answer 3

我相信这正是您所寻找的https://github.com/SBoudrias/ast-query