@babel/traverse 使用方法小记_晚秋_前端开发者

@babel/traverse 

@babel/traverse 

官网: https://babeljs.io/docs/en/babel-traverse

官网: https://babeljs.io/docs/en/babel-traversehttps://babeljs.io/docs/en/babel-traverse

github:https://github.com/babel/babel/blob/master/packages/babel-traverse/test/traverse.js

github:https://github.com/babel/babel/blob/master/packages/babel-traverse/test/traverse.jshttps://github.com/babel/babel/blob/master/packages/babel-traverse/test/traverse.js

 

了解一个东西最直接的方法就是看官网了解怎么用,看github源码Test模块代码的使用和测试。

了解一个东西最直接的方法就是看官网了解怎么用,看github源码Test模块代码的使用和测试。

 

@babel/traverse 可以用来遍历更新@babel/parser生成的AST

@babel/traverse 可以用来遍历更新@babel/parser生成的AST@babel/traverse 可以用来遍历更新@babel/parser生成的AST

  • 对语法树中特定的节点进行操作(特殊节点的函数)
  • 进入节点(enter)
  • 退出节点  (exit)
  • 对语法树中特定的节点进行操作(特殊节点的函数)
  • 对语法树中特定的节点进行操作(特殊节点的函数)

    对语法树中特定的节点进行操作(特殊节点的函数)

  • 进入节点(enter)
  • 进入节点(enter)

    进入节点(enter)

  • 退出节点  (exit)
  • 退出节点  (exit)

    退出节点  (exit)

     

    traverse(ast, {
      CallExpression(p) {
        // 对语法树中特定的节点进行操作 参考@babel/types (特定节点类型)
        // CallExpression 特定节点
      },
      FunctionDeclaration: function(path) {
        // 对语法树中特定的节点进行操作 参考@babel/types (特定节点类型)
        // FunctionDeclaration 特定节点
      }
      // .....
    
      enter(path) {
        // 进入节点
        if (path.node.type === "ThisExpression") {
          // 对所有的操作
        };
      }
      exit(path) {
        // 退出节点
        console.log(`  exit ${path.type}(${path.key})`)
      }
    })
    traverse(ast, {
      CallExpression(p) {
        // 对语法树中特定的节点进行操作 参考@babel/types (特定节点类型)
        // CallExpression 特定节点
      },
      FunctionDeclaration: function(path) {
        // 对语法树中特定的节点进行操作 参考@babel/types (特定节点类型)
        // FunctionDeclaration 特定节点
      }
      // .....
    
      enter(path) {
        // 进入节点
        if (path.node.type === "ThisExpression") {
          // 对所有的操作
        };
      }
      exit(path) {
        // 退出节点
        console.log(`  exit ${path.type}(${path.key})`)
      }
    })

    traverse(ast, {
    CallExpression(p) {
    // 对语法树中特定的节点进行操作 参考@babel/types (特定节点类型)// CallExpression 特定节点 },
    FunctionDeclaration:
    function(path) {
    // 对语法树中特定的节点进行操作 参考@babel/types (特定节点类型)// FunctionDeclaration 特定节点 }
    // …..
    enter(path) {
    // 进入节点if) {
    // 对所有的操作 };
    }
    exit(path) {
    // 退出节点 console.log(` exit ${path.type}(${path.key})`)
    }
    })

     

    » 本文来自:前端开发者 » 《@babel/traverse 使用方法小记_晚秋_前端开发者》
    » 本文链接地址:https://www.rokub.com/73570.html
    » 您也可以订阅本站:https://www.rokub.com
    赞(0)
    64K

    评论 抢沙发

    评论前必须登录!