[AST Babel] Create a simple babel plugin

PANH 2020-02-19

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+)/
      }
    }
  };
}

相关推荐

蜗牛慢爬的李成广 / 0评论 2020-01-28