AST-原理+babel安装

This commit is contained in:
luzhisheng 2022-03-04 15:31:31 +08:00
parent 35d7466fc9
commit cf11277437
2 changed files with 95 additions and 12 deletions

View File

@ -160,4 +160,85 @@ Babel 手册
} }
] ]
输出效果 遍历内容拿到变量名 name 和 value 值
// 将JS源码转换成语法树
var parser = require("@babel/parser");
// 为parser提供模板引擎
var template = require("@babel/template").default;
// 遍历AST
var traverse = require("@babel/traverse").default;
// 操作节点,比如判断节点类型,生成新的节点等
var t = require("@babel/types");
// 可以直接用type声明一断新的代码
// 将语法树转换为源代码
var generator = require("@babel/generator").default;
// 操作文件
var fs = require("fs");
var jscode = fs.readFileSync("read.js", { //更改读取文件
encoding: "utf-8"
});
let ast = parser.parse(jscode);
var traverses =
{
// 遍历节点,当遇到下列类型的时候会调用函数
VariableDeclarator(path) {
console.log(path.node.id.name);
console.log(path.node.init.value);
}
};
traverse(ast, traverses);
输出
a
1
修改 value 值
// 将JS源码转换成语法树
var parser = require("@babel/parser");
// 为parser提供模板引擎
var template = require("@babel/template").default;
// 遍历AST
var traverse = require("@babel/traverse").default;
// 操作节点,比如判断节点类型,生成新的节点等
var t = require("@babel/types");
// 可以直接用type声明一断新的代码
// 将语法树转换为源代码
var generator = require("@babel/generator").default;
// 操作文件
var fs = require("fs");
var jscode = fs.readFileSync("read.js", { //更改读取文件
encoding: "utf-8"
});
let ast = parser.parse(jscode);
var traverses =
{
// 遍历节点,当遇到下列类型的时候会调用函数
VariableDeclarator(path) {
console.log(path.node.id.name);
path.node.init = t.stringLiteral("ayf");
console.log(path.node.init.value);
}
};
traverse(ast, traverses);
let code = generator(ast);
console.log(code);
console.log(code.code);
输出
a
ayf
{ code: 'var a = "ayf";', map: null, rawMappings: undefined }
var a = "ayf";

View File

@ -18,16 +18,18 @@ var jscode = fs.readFileSync("read.js", { //更改读取文件
let ast = parser.parse(jscode); let ast = parser.parse(jscode);
var traverses =
function traverse_all_MemberExpression(ast) { {
// 遍历节点,当遇到下列类型的时候会调用函数 // 遍历节点,当遇到下列类型的时候会调用函数
traverse(ast, { VariableDeclarator(path) {
MemberExpression: { console.log(path.node.id.name);
enter: [replace] path.node.init = t.stringLiteral("ayf");
}, console.log(path.node.init.value);
})
} }
};
traverse_all_MemberExpression(ast); traverse(ast, traverses);
console.log(ast); let code = generator(ast);
console.log(code);
console.log(code.code);