@babel/traverse是Babel中用于深度遍历和操作AST的核心工具，通过visitor模式精准匹配节点（如StringLiteral、MemberExpression），配合replaceWith()安全替换、scope API维护作用域、t.isXxx()校验结构，实现健壮的代码转换。
@babel/traverse 是 Babel 生态中用于深度遍历和操作 AST（抽象语法树）的核心工具，它不直接做转换，而是提供一套声明式、可组合的节点访问机制。要精准实现代码替换，关键在于：正确识别目标节点、安全创建新节点、避免破坏作用域和上下文、并确保替换后 AST 仍合法。
明确遍历目标：用 visitor 模式精准匹配节点
traverse 接收一个 visitor 对象，键是节点类型（如 Identifier、CallExpression），值是处理函数。Babel 会自动递归进入子树，并在匹配节点时调用对应函数。注意区分 enter 和 exit 阶段 —— 替换操作通常放在 enter 中，但需避免在已替换的子节点上重复触发（可通过 node._replaced 标记或使用 path.stop() 控制）。
- 用 StringLiteral 匹配字符串字面量：
{ StringLiteral(path) { if (path.node.value === 'old') { path.replaceWith(t.stringLiteral('new')); } } } - 用 MemberExpression 匹配对象属性访问：
{ MemberExpression(path) { const { object, property } = path.node; if (t.isIdentifier(object, { name: 'console' }) && t.isIdentifier(property, { name: 'log' })) { path.replaceWith(t.callExpression(t.identifier('debug'), [t.stringLiteral('LOG')])) } } } - 支持嵌套条件：用 t.isXxx() 辅助判断节点结构，比硬写
node.type === 'xxx'更健壮
安全替换：优先用 replaceWith()，慎用 remove() 和 insertBefore()
replaceWith() 是最常用且最安全的替换方式，它会自动处理父节点引用、路径更新和作用域关联。不要手动修改 path.parent 或 path.container，否则易导致 AST 不一致。若需插入多个节点，用 replaceWithMultiple()；若需删除并插入，先 path.remove() 再 path.parentPath.insertBefore()，但务必检查父节点类型是否允许该操作（例如不能在 Program 外插入语句）。
- 替换为单个节点：
path.replaceWith(t.numericLiteral(42)) - 替换为多个语句（如把表达式转为变量声明 + 返回）：
path.replaceWithMultiple([t.variableDeclaration('const', [t.variableDeclarator(t.identifier('x'), t.numericLiteral(42))]), t.returnStatement(t.identifier('x'))]) - 避免“替换自己又遍历自己”：替换后调用
path.skip()跳过子树遍历，防止重复处理
保持作用域正确：访问变量时用 scope 查找绑定
直接改 Identifier 名字可能破坏作用域（比如重命名局部变量却没更新所有引用）。正确做法是通过 path.scope 获取当前作用域，再调用 scope.rename(oldName, newName) 或 scope.getBinding(name) 判断是否为局部变量。若只是替换字面量或调用，无需关心作用域；但涉及标识符改名、提取变量、内联常量等操作，必须走 scope API。
立即学习“Java免费学习笔记（深入）”；
- 安全重命名：
path.scope.rename('oldVar', 'newVar')—— 自动更新所有同作用域引用 - 判断是否为全局变量：
!path.scope.getBinding('window')?.constant（需结合实际绑定信息） - 注入新变量时，用 scope.generateUidIdentifier('temp') 确保名称唯一，避免冲突
调试与验证：打印 AST、启用 strict 模式、用 @babel/types 校验
开发阶段建议用 @babel/parser 解析源码后，用 @babel/generator 输出结果对比；用 console.log(path.toString()) 查看当前节点生成的代码；对关键替换加 t.isXXX(newNode) 断言校验节点类型。启用 traverse(..., { skipKeys: [] }) 可强制遍历所有属性（默认跳过某些元数据），便于调试深层结构。
- 快速查看 AST 结构：
console.log(JSON.stringify(ast, null, 2))（配合 parseSync） - 生成可读代码：
generate(ast).code，比直接看 AST 更直观 - 校验新节点合法性：
if (!t.isCallExpression(newNode)) throw new Error('Expected CallExpression')
