zoukankan      html  css  js  c++  java
  • [AST Babel] Create a simple babel plugin

    For example, we have the source code:

    getVersison('3.4.5')
    
    function getVersion(versionString) {
        const versionRegex = /(d).(d).(d+)/
        const [, major, minor, patch] = versionRegex.exec(versionString)
        return {major, minor, patch}
    }

    We want to transform it into:

    const _versionRegex = /(d).(d).(d+)/;
    getVersison('3.4.5')
    
    function getVersion(versionString) {
        const [, major, minor, patch] = _versionRegex.exec(versionString)
        return {major, minor, patch}
    }

    Babel plugin:

    export default function (babel) {
      const { types: t } = babel;
      
      return {
        name: "ast-transform", // not required
        visitor: {
          RegExpLiteral(path) {
            const name = path.parent.id.name; //versionRege
            const newIdentifier = path.scope.generateUidIdentifier(name) // _versionRegex
            const variableDeclaration = t.variableDeclaration('const', [
                t.variableDeclarator(newIdentifier, path.node)
            ]) // const _versionRegex = /(d).(d).(d+)/;
            
            console.log(variableDeclaration)
            
            
            /*
            - const [, major, minor, patch] = versionRegex.exec(versionString)
            + const [, major, minor, patch] = _versionRegex.exec(versionString)
            */
            path.scope.rename(name, newIdentifier.name)
            
            const program = path.findParent(
             t.isProgram
            )
            
            console.log(program.node.body)
            
            program.node.body.unshift(variableDeclaration) // + const _versionRegex = /(d).(d).(d+)/;
            
            path.parentPath.remove() // - const versionRegex = /(d).(d).(d+)/
          }
        }
      };
    }
  • 相关阅读:
    my15_ mysql binlog格式从mixed修改为row格式
    my14_mysql指定时间恢复之模拟从库
    my13_mysql xtrabackup备份的时间点
    必知必会的图论算法
    leetcde37. Sudoku Solver
    leetcode36. Valid Sudoku
    leetcode52. N-Queens II
    leetcode51. N-Queens
    First Missing Positive
    Maximum Gap
  • 原文地址:https://www.cnblogs.com/Answer1215/p/12332952.html
Copyright © 2011-2022 走看看